css是什麼？有什麼用？

CSS，即層疊樣式表（Cascading Style Sheets），是一種用於網頁設計的樣式語言。透過CSS，你可以改變HTML頁面上各個元素的外觀、佈局和行為。

CSS最初是由賽迪公司（斯佩克特公司）的開發者創建的，並於1996年成為一項業界標準。隨著網路的發展，在HTML語言出現之後，CSS已經成為了使用最廣泛的網頁設計工具之一。

讓我們來看看CSS有哪些基本的用途。

1. 改變字體、顏色和大小

透過使用CSS，你可以輕鬆地改變頁面文字的大小、顏色、字體等屬性。例如，你可以使用以下程式碼來改變段落的文字樣式：

p {
    color: blue;
    font-size: 16px;
    font-family: Arial;
}

這個程式碼區塊會將所有的段落文字顏色改為藍色、文字大小改為16像素、字體改為Arial。

2. 排列頁面元素

CSS也允許你控制頁面上各個元素的位置和佈局。透過使用CSS中的定位和浮動屬性，你可以輕鬆地實現複雜的佈局效果。例如，你可以使用以下程式碼區塊實作一個簡單的頁首和頁尾佈局：

header {
    background-color: gray;
    height: 100px;
}

footer {
    background-color: gray;
    height: 50px;
    position: absolute;
    bottom: 0;
    width: 100%;
}

這個程式碼區塊將頁面中的header元素（頁首）背景顏色改為灰色，高度改為100像素。頁面中的footer元素（頁腳）背景顏色也改為灰色，高度為50像素，並將它定位在頁面底部。

3. 建立響應式網頁

隨著手機和平板電腦的普及，人們越來越多地使用行動裝置瀏覽網頁。這也導致了一個新的需求：能夠適應不同螢幕大小的網站設計。

CSS透過媒體查詢（Media Queries）功能實現響應式網頁的設計。透過使用響應式佈局技術，你可以輕鬆地為不同的裝置和螢幕寬度設定不同的樣式和佈局。

@media screen and (max-width: 600px) {
    /* 小于600像素宽度时的样式 */
    body {
        font-size: 14px;
    }
}

@media screen and (min-width: 601px) and (max-width: 900px) {
    /* 在601像素至900像素宽度范围内的样式 */
    body {
        font-size: 16px;
    }
}

@media screen and (min-width: 901px) {
    /* 大于900像素宽度时的样式 */
    body {
        font-size: 18px;
    }
}

這個程式碼區塊會為頁面設定三個不同的視窗寬度範圍，並在不同的範圍內設定不同的字體大小。

總結一下，CSS是一種用來設計網頁的樣式語言，它可以用來改變HTML頁面上各個元素的外觀、佈局和行為。透過掌握CSS，你可以設計出漂亮、強大且易於使用的網頁，讓你的網頁和網站更吸引人、更容易使用。

以上是css是什麼？有什麼用？的詳細內容。更多資訊請關注PHP中文網其他相關文章！