在網頁設計中，CSS除了起到美化網頁的作用，還能夠用來實現網站的新聞發布功能。下面介紹如何使用CSS制作新聞布局。

首先，在HTML文件中使用div標簽來包裹每篇新聞，并給這些div設置相同的類名或ID。

<div class="news">
<h2>新聞標題</h2>
<p>新聞內容</p>
</div>
<div class="news">
<h2>新聞標題</h2>
<p>新聞內容</p>
</div>
<div class="news">
<h2>新聞標題</h2>
<p>新聞內容</p>
</div>

接著，在CSS文件中設置新聞布局的樣式。可以通過float屬性來使每篇新聞左浮動，讓它們在同一行顯示。同時給它們設置固定的寬度，以便在屏幕尺寸變小時自適應調整寬度。

.news {
float: left;
width: 30%;
margin-right: 3%;
}

此時每篇新聞都處于同一個水平位置。如果不加限制，新聞的高度也將是不固定的，使得網頁不夠美觀。通過給新聞設置固定的高度和overflow屬性來限制每篇新聞的高度，使得新聞在同一水平線上，不會因新聞內容長度不一而發生錯位。

.news {
float: left;
width: 30%;
margin-right: 3%;
height: 200px;
overflow: hidden;
}

最后加上一些裝飾性的樣式來美化新聞布局，比如給新聞加上背景色和邊框，改變字體和顏色等等。最終的代碼如下：

.news {
float: left;
width: 30%;
margin-right: 3%;
height: 200px;
overflow: hidden;
background-color: #F9F9F9;
border: 1px solid #CCC;
padding: 10px;
font-family: Arial, sans-serif;
font-size: 16px;
color: #333;
}
.news h2 {
font-size: 20px;
margin-bottom: 10px;
color: #FF6600;
}
.news p {
margin: 0;
}

通過以上的CSS設置，我們就可以制作出美觀的新聞布局了。在實際應用中，還可以加上hover效果，使得鼠標懸停在新聞上時背景變更，效果更加生動。