HTML和CSS是構建Web頁面的兩個重要技術。HTML是Web頁面的重要骨架，而CSS則為網頁增添了更加豐富的視覺效果。HTML和CSS的發展歷程可以追溯到20世紀90年代，那時候，互聯網還很年輕，Web頁面很簡單，主要都是文本和圖片的展示。
隨著Web技術的發展，HTML和CSS也不斷地升級。從最初的HTML 1.0，到XHTML、HTML 4.0，再到目前的HTML5版本，HTML不斷地增加了許多新的標簽和屬性，為開發者們提供更為強大、復雜的頁面設計和交互效果。HTML 5版本還推出了許多強大的API，例如Canvas、WebWorker、WebSocket、Web Storage等，使得Web應用程序的開發變得更加直觀和簡單。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML 5 示例</title>
<style>
body { background-color: white; }
h1 { color: red; font-size: 3em; }
p { color: blue; font-size: 1.2em; line-height: 1.5em; }
img { border: 1px solid black; }
</style>
</head>
<body>
<h1>HTML 5 示例</h1>
<p>這是一個HTML5示例頁面，包含了常用的標簽和CSS樣式。</p>
<img src="https://picsum.photos/200/300" alt="隨機圖片">
</body>
</html>CSS3是CSS的升級版本，也是Web頁面視覺設計的重要工具。CSS3增加了豐富的效果和屬性，例如圓角、陰影、漸變、動畫等等，這些都可以讓開發者們更加靈活地設計Web頁面。CSS3還引入了響應式設計的概念，通過Media Query可以讓頁面更好地適應不同的設備和屏幕尺寸。
<style>
.box {
width: 200px;
height: 200px;
background-color: yellow;
border-radius: 50%;
box-shadow: 5px 5px 5px gray;
transition: transform 0.5s ease-in-out;
}
.box:hover {
transform: rotate(360deg);
}
@media screen and (max-width: 768px) {
.box {
width: 100px;
height: 100px;
font-size: 0.8em;
margin: 10px;
}
}
</style>
<div class="box"></div>隨著HTML和CSS的不斷發展，Web頁面呈現了更加多樣化、豐富和復雜的效果。Web應用程序的開發也變得越來越便利和高效。未來，我們相信HTML和CSS還將繼續發展，并為Web技術帶來更加卓越的成果。
上一篇css導航欄右邊空白
下一篇css導航模仿