CSS(Cascading Style Sheets)是網頁設計和開發中必不可少的技術。CSS可以控制網頁的樣式、布局和響應效果,讓網頁更加優雅、美觀和易于使用。下面是一些常見的CSS使用場景:
1. 頁面布局
/* 使用 CSS 對頁面進行布局 */ header { background-color: #333; color: #fff; height: 60px; } nav { float: left; width: 200px; } section { float: right; width: calc(100% - 200px); }
2. 文字樣式
/* 使用 CSS 控制文字的字體樣式和顏色 */ h1 { font-size: 36px; font-family: Arial; color: #333; } p { font-size: 18px; font-family: Helvetica; color: #666; }
3. 圖片布局
/* 使用 CSS 控制圖片的布局和尺寸 */ img { display:block; margin: 0 auto; max-width: 100%; height: auto; }
4. 表單樣式
/* 使用 CSS 控制表單的樣式 */ input[type="text"], textarea { padding: 10px; border: 1px solid #ccc; border-radius: 5px; font-size: 16px; } input[type="submit"] { background-color: #333; color: #fff; padding: 10px 20px; border: none; border-radius: 5px; font-size: 16px; cursor: pointer; }
除了以上例子,CSS還可以用于制作動畫、響應式設計等等。使用好CSS可以提高網頁效果和用戶體驗。