CSS筆記1

1.CSS 層疊樣式表(Cascading Style Sheets)

2.引入方式:? ? ? ? ??

1.行內(nèi)樣式;2.內(nèi)嵌樣式;3.鏈接樣式,文件擴展名為.css <link type="text/css" rel="stylesheet" href=" .css"/>

?4.導入樣式 @import url(" ") 放在<style>最上面,后面樣式會覆蓋上面樣式。導入式的結果和直接書寫是同樣的效果。

5.引入方式的優(yōu)先級:!important(最重要,優(yōu)先級最高)(10000) ?*通配符(優(yōu)先級最低)(0.5)

內(nèi)嵌式(1000)>id(100)>class(10)>標簽(1)

優(yōu)先級加法運算(包含選擇器權重相加)

3.選擇器

1.通配符選擇器 ? ?語法:*{規(guī)則} ? ? 如*{margin:0;padding:0;}(格式化文檔)

2.ID選擇器? ? 語法:#id{規(guī)則}

3.類選擇器? ? 語法:.className{規(guī)則} ? 瀏覽器渲染時從上到下,從左到右。加多個類時,每個類之間用空格隔開

4.包含選擇器 ? ?通過標簽的嵌套選擇標簽 ? 語法:選擇符a ?選擇符b{規(guī)則}?

只要某個元素下的直接子元素:父元素>子元素

?找到某個元素下所有的子元素(包含直接子元素(兒子)和間接子元素(孫子)):父元素 子元素{ }

5.類型(標記)選擇器 ?即使用標簽的名字作為選擇符 ?語法:標簽{規(guī)則} ?如td{color:#f00;}

4.RGB在CSS中的表達方式

1.直接使用顏色的英文單詞

2.使用三色的數(shù)值,如rgb(255,255,0)

3.使用三色的十六進制,如#0000ff

4.rgba 背景透明度(0~1)

5.font樣式

1.font-family 可以為文字指定多種字體,不同字體間用“,”隔開,自提名字中間有空格的,要用雙引號引起來

2.font-size 字體大小

3.font-style 字體傾斜效果 normal不傾斜 italic和oblique傾斜

4.font-weight 字體粗細 ?normal正常粗細 ?bold粗體 ?bolder加粗體 ?lighter比正常粗體細

6.text樣式

1.text-transform 英文字母大小寫轉換 ? ?capitalize單詞首字母大寫 ? uppercase全部大寫 ?lowercase全部小寫

2.text-decoration 文本的裝飾效果 ?underline文字加下劃線 ?line-through文字加刪除線 ?overline文字加上劃線 none去除下劃線

3.text-indent 段落內(nèi)容首行縮進(單位用em)

4.字詞間距 ?英文文本 letter-spacing(字母和字母間距) word-spacing(單詞和單詞間距)

中文文本 ?letter-spacing(字和字之間的間距)

overflow:visible(默認)超出部分可見 ? auto(瀏覽器自動處理)

hidden(超出部分隱藏) ?scroll(出現(xiàn)滾動條) ?

5.text-overflow(文本溢出處理):clip(不顯示省略標記,簡單裁切) ? ellipsis(文本溢出顯示省略標記)

6.white-space(元素空白的處理):nowrap(不換行) pre(保留空白) ?<nobr>強制不換行

7.垂直居中:line-height等于height值

文本居中對齊用"text-align:center"

text-align:文本的水平位置 ?left:左對齊(默認值) right:右對齊 ?center:居中對齊 ?justify:兩端對齊(justify主要用于英文,只能對多行中的非最后一行兩端對齊)

vertical-align:baseline/top/text-top/middle/bottom

最后編輯于
?著作權歸作者所有,轉載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽默認的外補...
    _Yfling閱讀 14,131評論 1 92
  • 學習CSS的最佳網(wǎng)站沒有之一 http://www.w3school.com.cn/tags/index.asp ...
    Amyyy_閱讀 1,183評論 0 1
  • 1.CSS基本概念 1.1 CSS的定義 CSS(Cascading Style Sheets)層疊樣式表,主要用...
    寥寥十一閱讀 2,058評論 0 6
  • CSS基礎 本文包括CSS基礎知識選擇器(重要?。。。├^承、特殊性、層疊、重要性CSS格式化排版單位和值盒模型浮動...
    廖少少閱讀 3,439評論 0 40
  • 語義化 標簽一 標簽二 CSS 認識CSS 1、CSS全稱為“層疊樣式表 (Cascading Style She...
    wq04200閱讀 956評論 0 1

友情鏈接更多精彩內(nèi)容