1 什麼是css,css是如何工作的?
css(層疊樣式表 cascading style sheet)是決定了如何顯示html元素的,如html內容的字型大小顏色等
css的工作原理是
瀏覽器將css的規則應用在html,前置條件是html中已經引用了css檔案
a. 瀏覽器載入html
b. 瀏覽器解析html,同時載入css
c. 瀏覽器解析css,並使css結合html,生成dom(document object model,文件物件模型)
d. 瀏覽器展示dom
2 css的基本語法是怎樣的?
css規則由兩個部分構成的:選擇器以及一條或者多條宣告
selector
選擇器是你需要新增樣式的html元素,宣告是由乙個屬性和乙個值組成的。
屬性(property)是您希望設定的樣式屬性(style attribute)。每個屬性有乙個值。屬性和值被冒號分開。
selector
3 css選擇器是什麼概念,簡單選擇器和屬性選擇器是什麼?
選擇器是一種模式,可以匹配頁面的元素
簡單選擇器可以分為以下三類:
a:元素選擇器,利用html的標籤選擇元素(例如p, div, h1)
b:類選擇器,由乙個點「.」和類名組成。類名是在html由 class定義的名稱。
c:id選擇器,#和給定元素的id名稱組成。 id是在html由 id定義的名稱,任何元素都可以使用id屬性設定唯一的id名稱。
屬性選擇器可以分別為兩類:
屬性選擇器是一種特殊型別的選擇器,它根據元素的 屬性和屬性值來匹配元素。它們的通用語法由方括號() 組成,其中包含屬性名稱,後跟可選條件以匹配屬性的值。 屬性選擇器可以根據其匹配屬性值的方式分為兩類: 存在和值屬性選擇器和子串值屬性選擇器。
a:和值屬性選擇器
[title]
[title=w3cschool]
b:子串值屬性選擇器
4 文字樣式都有哪些相關屬性,對應哪些值?
縮排文字
text-indent屬性 所有元素的第一行可以縮排乙個給定的長度,可以取正值,負值以及百分比
p p
p 水平對齊
text-align屬性,會影響乙個元素文字行互相之間的對齊方式
left right center分別代表左對齊,右對齊,和居中對齊
center不僅影響文字,還會把整個元素居中
字間隔word-spacing屬性可以改變字(單詞)之間的標準間隔
字母間隔
letter-spacing可以改變字母之間的間隔增加或者減少
字元轉換
text-transform 屬性處理文字的大小寫
none 預設值對文字不做任何改動
uppercase 轉化為大寫
lowercase 轉化為小寫
capitalize 只對首字母進行大寫
6 文字裝飾
text-decoration屬性
none:預設值
underline:對元素加下劃線
overline:對元素加上劃線
line-through:在文字中間畫乙個貫穿線
blink:讓文字閃爍
7 處理空白符
white-space屬性
normal:瀏覽器按照正常做法處理。丟掉多餘的空白符
pre: 瀏覽器將會注意額外的空格,甚至回車。在這個方面,而且僅在這個方面,任何元素都可以相當於乙個 pre 元素。
pre-wrap和pre-line: 如果元素的 white-space 設定為 pre-wrap,那麼該元素中的文字會保留空白符序列,但是文字行會正常地換行。如果設定為這個值,源文字中的行分隔符以及生成的行分隔符也會保留。pre-line 與 pre-wrap 相反,會像正常文字中一樣合併空白符序列,但保留換行符。
百度前端技術學院 第三天(下)
1 css介紹 層疊樣式表,用於表示頁面的樣式 2 css實際上如何工作?1 瀏覽器將html和css轉化成dom 文件物件模型 dom在計算機中表示文件,它把文件內容和其樣式結合在一起 2 瀏覽器顯示dom的內容 3 什麼是dom?dom是一種樹形結構,標記語言中的每個元素,屬性,文字片段都變成為...
百度前端學院第三天 CSS基本
color red 設定顏色 font family sans serif 設定字型樣式 font style italic 設定字型風格 normal 預設值。瀏覽器顯示乙個標準的字型樣式。italic 瀏覽器會顯示乙個斜體的字型樣式。oblique 瀏覽器會顯示乙個傾斜的字型樣式。inherit...
百度前端技術學院 第一 二天整理
1 html是什麼,html5是什麼 html全名為hyper text markup language 超文字標記語言,html5表示他的第五代,是最新的html標準,擁有更豐富的語義 圖形以及多 元素等內容。2 html元素標籤 屬性都是什麼概念 html元素標籤是指文字下的被瀏覽器解析的東西,...