目錄
前言
學習了一段時間了解了什么是CSS,我歸納出了我覺得在CSS中非常重要的四個知識點。首先就是:CSS選擇器,,其次是:盒子模型,然后是引入方式,那么最后一個就是:浮動,首先讓我們先來看看CSS選擇器和引入方式!
一、css選擇器 1、基礎選擇器
是單個選擇器組成,包括標簽選擇器、類選擇器、ID選擇器和通配符選擇器。
標簽選擇器:標簽名{ 屬性:屬性值;},用HTML標簽作為選擇器;可以吧某一類標簽全部選擇出來,如所有的div標簽和p標簽;可以快速統一設置樣式;但是不能設計差異化樣式。
類選擇器:.類名{ 屬性:屬性值;},如.red{ color:red;}將所有的red類的HTML元素均為紅色;結構還需要class屬性來調用class類;如
文字
可以單獨選一個或某幾個標簽
多類名選擇器:在標簽class屬性離寫多個類名,類名之間用空格分開,可以把一些標簽元素相同的共同的步伐放在一個類里面,這些標簽都可以調用這個公共的類
語法:如
id選擇器:以id屬性來設置id選擇器,css中id選擇器以“#”來定義:#id名{屬性:屬性值; },口訣:樣式#定義,結構id來調用,只能調用一次。
通配符選擇器 :*{屬性:屬性值;}
2、復合選擇器
復合選擇器包括后代選擇器、子選擇器、并集選擇器、偽類選擇器(鏈接偽類選擇器、:focus偽類選擇器)
后代選擇器: 又為包含選擇器,可以選擇父元素里面的子元素;
語法:元素1 元素2 {樣式聲明},選擇元素1里面的所有元素2;元素1和元素2 中間用空格隔開,最終選擇的是元素2;
元素2 可以是兒子也可以是孫子;元素1 和元素2 可以是任意基礎選擇器
子選擇器:只能選擇某元素最近的一級子元素; 元素1>元素2(樣式聲明);比如div>p { }
元素1 和元素2之間用大于隔開,元素2必須是最近的,親兒子
并集選擇器:可以選擇多組標簽定義相同的樣式,各選擇器是用英文逗號隔開;通常用于集體聲明。
語法:元素1 ,元素2 {} ; 如ul,div { 屬性:屬性值 };
偽類選擇器 :偽類選擇器用于向某些選擇器添加特殊的效果,比如給鏈接添加特殊效果。
偽類選擇器最大的特點是用冒號:表示,比如:hover或者:first-child
二、css引入方式
css的引入方式有三種:行內樣式表、外部樣式表和內部樣式表;
前兩個上面有提到,內部樣式表就是在HTML頁面里,在3、外部樣式基礎選擇器1、標簽選擇器:針對一類標簽