HTML和CSS是現代網頁設計的重要語言，前者負責內容和結構的定義，后者負責頁面樣式的設置。HTML用來編寫網站的基本結構內容，CSS用來設置網站的布局樣式。我們可以使用HTML和CSS創建靜態網站，這在個人、學校或小型企業的網站上非常常見。
<!DOCTYPE html> <html> <head> <title>我的靜態網站</title> <link rel="stylesheet" type="text/css" href="style.css"> </head> <body> <header> <h1>我的網站</h1> <nav> <ul> <li><a href="#">首頁</a></li> <li><a href="#">介紹</a></li> <li><a href="#">聯系我</a></li> </ul> </nav> </header> <section> <h2>我的介紹</h2> <p>我是一名網頁設計師，我喜歡使用HTML和CSS為客戶設計漂亮的網站。我熱愛學習新技能，也會花時間研究最新的設計趨勢。</p> </section> <footer> <p>版權所有 © 2021 我的網站</p> </footer> </body> </html>
在上面的代碼中，我們定義了一個網站的基本結構，包括頭部、導航、主體內容和頁腳。我們還定義了一個外部樣式表用于設置網站的布局和樣式。
在樣式表中，我們可以對網站的文本、顏色、字體、背景、邊框等進行設置。通過選擇器來選擇網站中不同的元素，例如header、nav、h1、li、p等等。
body {
font-family: Arial, sans-serif;
color: #333;
}
header {
background-color: #EEE;
padding: 10px;
}
nav ul {
list-style: none;
margin: 0;
padding: 0;
}
nav li {
display: inline;
margin-right: 20px;
}
a {
text-decoration: none;
color: #333;
}
section {
margin: 20px;
}
h2 {
color: #333;
}
p {
line-height: 1.5;
}通過HTML和CSS，我們可以創建出非常漂亮的靜態網站。當然，靜態網站還存在一些不足，比如無法動態地獲取和更新內容，需要手動修改和更新頁面內容，無法與用戶進行互動等等。但在一些場景下，靜態網站仍然是非常實用和適用的，而且學習和使用HTML和CSS是網頁設計的必備技能。
上一篇html css設計導航
下一篇mysql45講丁奇視頻