CSS是一種用于創(chuàng)建網頁樣式的語言，可以讓網頁的外觀更加美觀，交互更加友好。下面是一個百度百科的CSS網頁示例，展示了如何使用CSS來創(chuàng)建具有復雜布局和樣式的網頁。
HTML代碼：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>百度百科</title>
<style>
/* 定義基本的樣式 */
body {
font-family: Arial, sans-serif;
background-color: #f2f2f2;
color: #333;
}
/* 定義導航欄樣式 */
header {
background-color: #007bff;
color: #fff;
padding: 20px;
}
/* 定義側邊欄樣式 */
nav {
background-color: #fff;
border-bottom: 1px solid #0069b3;
padding: 20px;
}
/* 定義頁腳樣式 */
footer {
background-color: #007bff;
color: #fff;
padding: 20px;
}
</style>
</head>
<body>
<header>百度百科</header>
<nav>
<ul>
<li><a href="#">百度百科首頁</a></li>
<li><a href="#">百度百科分類</a></li>
<li><a href="#">百度百科熱門文章</a></li>
<li><a href="#">百度百科最新文章</a></li>
</ul>
</nav>
<main>
<h1>百度百科簡介</h1>
<p>百度百科是一款中文的百科全書，由百度公司開發(fā)，旨在為人們提供全面、準確、及時、權威的知識信息。</p>
<section>
<h2>百度百科分類</h2>
<ul>
<li><a href="#">歷史</a></li>
<li><a href="#">科技</a></li>
<li><a href="#">文化</a></li>
<li><a href="#">藝術</a></li>
</ul>
</section>
<section>
<h2>百度百科熱門文章</h2>
<ul>
<li><a href="#">百度百科關于人工智能的文章</a></li>
<li><a href="#">百度百科關于區(qū)塊鏈技術的文章</a></li>
<li><a href="#">百度百科關于中國文學的文章</a></li>
</ul>
</section>
<section>
<h2>百度百科最新文章</h2>
<ul>
<li><a href="#">百度百科關于人工智能最新進展的文章</a></li>
<li><a href="#">百度百科關于區(qū)塊鏈最新研究的文章</a></li>
<li><a href="#">百度百科關于中國文學最新進展的文章</a></li>
</ul>
</section>
</main>
<footer>百度百科版權所有 (c) 2023百度百科</footer>
</body>
</html>
這個HTML文件包含了一個百度百科的頁面，其中包括一個標題、側邊欄、文章列表和頁腳等元素。通過使用CSS，可以對這些元素進行樣式化，使其更具美觀性和可讀性。
CSS的作用：
CSS可以用來定義網頁的外觀和交互，包括字體、顏色、邊距、背景等。通過CSS，可以創(chuàng)建出具有高度定制化的網頁，讓網頁更具可讀性、可用性和吸引力。
在這個示例中，使用CSS可以創(chuàng)建出具有復雜布局和樣式的網頁，使百度百科的頁面更加美觀和易于使用。通過使用CSS，可以讓百度百科這樣的大型網站更具可讀性和可用性，從而吸引更多的用戶。