在CSS中，我們可以使用text-decoration屬性來為文字添加下劃線、刪除線等裝飾線。下劃線是我們常見的一個裝飾線，可以用來表示文本鏈接、強調關鍵字等。

但是，有時候我們可能還需要在文本下方添加一條橫線，而這個橫線不是簡單的裝飾線，而是會根據文字長度自動調整寬度的。比如，我們在寫網站的標題時，可能需要在標題下面添加一條橫線來分隔內容和標題。

這個時候，我們可以使用CSS的::after偽元素，為字體下方添加一條橫線。下面是相關的CSS代碼：

p::after {
content: "";
display: block;
height: 2px;
width: 100%;
background: #000;
}

上面的代碼中，::after偽元素用來在元素的內容之后插入一個空的塊級元素。我們為這個元素設置了高度和背景顏色，同時將寬度設置為100%，這樣橫線就可以始終占滿整個元素的寬度。

如果我們需要在橫線兩側添加一些空白，我們可以使用以下代碼：

p::after {
content: "";
display: block;
height: 2px;
width: 80%;
margin: 10px auto 0;
background: #000;
}

上面的代碼中，我們將橫線的寬度設置為80%，然后通過margin屬性將橫線向上移動一些距離，并在兩側添加了10px的空白。

總之，通過這樣的方式，我們可以輕松地在CSS中為字體下方添加一條橫線，并根據需要調整寬度和樣式。這種技術在設計網站時非常有用，可以讓頁面看起來更加精美和工整。