CSS是什么及其继承与选择器
生活随笔
收集整理的這篇文章主要介紹了
CSS是什么及其继承与选择器
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
跟隨小甲魚老師每天學習一點CSS和HTML，其樂無窮
學習目錄
好，今天學的就是CSS的基礎部分了
CSS是什么
先上一段最純粹的CSS代碼：
body{background: #E77E22}
這一段代碼，大名叫規則，小名叫一條樣式。
選擇器就是上面代碼的body，選擇器是規則的應用對象。
方括號內的就是聲明的集合了，每條聲明包含屬性/值對，每條聲明后面都要加上一個分號。
CSS的繼承
先上樣例代碼：
<!doctype html> <html> <head><title>css的繼承</title><meta charset='utf-8'><style>#first{color: #F06}</style> </head><body><div id='first'>這是1<div id='second'>這是2<div id='third'>這是3</div></div></div></body> </html>
猜猜效果會是什么呢？
效果如下：
可以看出來它們的顏色都一樣，為什么呢？？
third,second,first的關系就好像父子一樣，
first是second的父節點,second是third的父節點，所以當給first設置了顏色屬性后，second和third就繼承過來了相應的屬性。
然后我們再重新設置一下CSS：
<style>#first{color: #F06}#second{color:#F67;}#third{color: #F98}</style>效果圖如下：
由此我們可以得到一個結論：CSS的繼承就是
兒子有定義，聽自己的；
沒有，聽老子的
CSS選擇器
CSS有三種最基礎的選擇器：標簽選擇器，id選擇器和類選擇器。 這三種選擇器不僅可以分開使用，還能組合使用。 比如： 1. 多個標簽需要設置共同的顏色： h1,h2,...hn{color: red}2.父子標簽聯合使用設置CSS section h1{ font-size:33px; }
3.還可以具體到孫子，，， section article h1{ font-size:33px }
4.標簽+類選擇器 section .red{ color:F#66F; font-size:33px; }注意：寫CSS 的時候，不同元素要用空格分開。
總結
以上是生活随笔為你收集整理的CSS是什么及其继承与选择器的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： String对象的indexOf方法
- 下一篇： javascript中match方法和e