信息展示是網頁設計中非常重要的一個方面，而CSS是實現信息展示的關鍵。CSS具有強大的排版功能，可以控制網頁元素的樣式、布局和交互效果。信息展示的常見場景包括在Web頁面上顯示表格、圖表、列表、按鈕等內容。下面我們將介紹一些常用的CSS技巧，來展示這些信息。

/*表格樣式*/
table {
border-collapse:collapse;
width:100%;
max-width:700px;
margin:0 auto;
/*表格行隔行換色*/
}
tr:nth-child(odd) {
background-color:#f2f2f2;
}
/*表格單元格邊框*/
td,th {
border:1px solid #ddd;
padding:8px;
}
/*表頭樣式*/
th {
text-align:left;
background-color:#4CAF50;
color:#fff;
}
/*圖表樣式*/
.chart {
width:600px;
height:400px;
margin:0 auto;
}
.chart h2 {
font-size:22px;
margin:0 auto 20px;
}
/*柱狀圖樣式*/
.bar {
background-color:#4CAF50;
color:#fff;
text-align:center;
line-height:40px;
margin-bottom:10px;
height:40px;
}
/*餅狀圖樣式*/
.pie {
width:200px;
height:200px;
border-radius:50%;
position:relative;
}
.pie::before {
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
border-radius:50%;
background-color:#f2f2f2;
}
/*列表樣式*/
ul {
list-style-type:none;
margin-left:20px;
}
/*帶圖標列表*/
li:before {
font-family:FontAwesome;
content:"\f0da";
margin-right:10px;
color:#4CAF50;
}
/*帶序號列表*/
li:first-of-type {
counter-reset:item;
}
li:before {
content:counter(item);
counter-increment:item;
margin-right:10px;
color:#4CAF50;
}
/*按鈕樣式*/
.btn {
display:inline-block;
padding:8px 16px;
font-size:16px;
cursor:pointer;
background-color:#4CAF50;
border:none;
color:#fff;
text-align:center;
} 
.btn:hover {
background-color:#3e8e41;
}

通過上述CSS代碼的組合，我們可以實現各種豐富多彩的信息展示效果。無論是表格、圖表、列表還是按鈕，都可以通過CSS來實現美觀、易讀、易用的Web頁面，為用戶提供高質量的信息展示體驗。