html&scc基礎知識

標籤：readonly   選中   class選取器   語言   tar   而且   field   span   分布   

html常用基礎標籤帶有語義的標籤

• em，強調
• strong ，比em強調層級更高
• abbr，定義縮寫，與title屬性相互搭配使用
• address，定義地址元素
• blockquote，定義區塊引述，通常情況下會產生縮排
• cite，通常情況下，某段話引子某本書，可以使用cite進行說明
• ins，定義被插入文本
• del，定義被刪除文本

帶有一定樣式的標籤

• b，定義粗體文本
• i，定義斜體文本
• big，定義大號文本
• small ，定義小號字型文本
• sup，上標文本
• sub，下標文本
• bdo，定義文本顯示方向，屬性：dir，值，ltr，rtl

輸出類標籤

• pre，代碼中樣式原樣輸出
• code，定義電腦代碼文本
• kbd，定義鍵盤文本
• var，定義變數

功能類標籤a標籤

• 定義超連結實現頁面跳轉
• 定義錨點實現書籤功能

列表

• 無序列表 ul，li
• 有序列表 ol，li

頁面嵌套

• iframe

圖片

• 瞭解即可

表格

• 表格標題 caption 標籤
• 表格頁首 th 標籤
• 表格的行 tr 標籤
• 表格的儲存格 td 標籤
• 表格的頭部 thead 標籤
• 表格的主幹 tbody 標籤
• 表格的尾部 tfoot 標籤

*頁面所有連結的基礎連結

• 標籤（位於head標籤內部）

表單輸入欄位<input>：

• type屬性：button,file,hidden,text,password,radio,checkbox,image,reset,submit.
• 其他屬性瞭解即可

文本輸入區<textarea>：

• cols屬性，規定可見列數
• rows屬性，規定可見行數
• disabled屬性，禁用當前文本輸入區
• name屬性，當前文本區的名字
• readonly屬性，當前文本地區唯讀

按鈕：

• disabled屬性，禁用此按鈕
• name屬性，按鈕名字
• type屬性，按鈕類型
• value屬性，按鈕上顯示常值內容的預設值

下拉式功能表表單中的標記<label>表單中相關元素分組<fieldset>css什麼是CSS

層疊樣式表(英文全稱：Cascading Style Sheets)是一種用來表現HTML（標準通用標記語言 (SGML)的一個應用）或XML（標準通用標記語言 (SGML)的一個子集）等檔案樣式的電腦語言。CSS不僅可以靜態地修飾網頁，還可以配合各種指令碼語言動態地對網頁各元素進行格式化。

CSS的使用方式

1. 內聯樣式，也稱行內樣式，寫在標籤內的樣式，隻影響該標籤內的元素。適合範圍，除<script>外的所有子標籤。
2. 內部樣式，定義在style標籤中，放在head標籤中，設定的樣式可以影響整個HTML頁面。
3. 外部樣式，將CSS樣式編寫並安放在一個獨立的.css檔案內。

CSS基礎選取器

• html選取器：
  通過html標籤名來選擇元素:
    1. 所有的html標籤都可以當做選取器
    2. 無論標籤藏多深都會被選中
    3. 選擇的是所有的標籤而不是具體某個標籤。所以說我們通過html標籤選取器來設定的都是一些共性問題。

• class選取器：
    1.任何的標籤都可以有id屬性和屬性值(因為id是一個全域屬性)。id命名不能隨意的命名。大小寫敏感 ，id的名字中可以有數字字母底線，但是要以字母開頭。
    2.但是id名不能夠重複

• id選取器：
     1.任何的標籤都可以使用class屬性(class屬性也是一個全域屬性)
     2.class屬性名稱可以重複使用
     3.一個class屬性中，可以有多個class屬性值。

區塊層級元素和行內元素概念

• 區塊層級元素：是指塊級框從上到下一個接一個地排列，框之間的垂直距離是由框的垂直外邊距計算出來。例如<div>標籤。
• 行內標籤：可以在同一行內分布。如<span>標籤。

兩種元素的區別

1. 行內元素部不能夠設定寬度和高度。行內元素的寬度和高度是標籤內容的寬度和高度。區塊層級元素可以設定寬度和高度。
2. 區塊層級元素會獨佔一行。而行內元素卻部能夠獨佔一行，只能和其他的行內元素共用一行。
3. 如果區塊層級元素不設定寬度，那麼區塊層級元素會自動的沾滿父元素的全部寬度。

區塊層級元素和行內元素的轉換

使用display屬性進行轉換。如下：

display：block ,inlin-block

綜合選取器

• 後代選取器:div p
• 焦急選取器:h3.test
• 並級選取器:div,p
• 子（直系兒子）元素選取器:div>p
• 序欄選取器:ul li:first-child ul li:last-child
• 相鄰兄弟選取器:div+p
• 普通兄弟選取器:div~p

CSS的繼承性和層疊性

• CSS的某些樣式是具有繼承性的，那麼什麼是繼承呢？繼承是一種規則，它允許樣式不僅應用於某個特定 html 標籤元素，而且應用於其後代。比如下面代碼：如某種顏色應用於 p 標籤，這個顏色設定不僅應用 p 標籤，還應用於 p 標籤中的所有子項目文本，這裡子項目為 span 標籤。
• 層疊就是在html檔案中對於同一個元素可以有多個css樣式存在，當有相同權重的樣式存在時，會根據這些css樣式的前後順序來決定，處於最後面的css樣式會被應用。
• 權重問題： 通用選取器（*） < 元素(類型)選取器 < 類別選取器 < 屬性選取器 < 偽類 < 識別碼選取器 <內聯樣式

注釋：!important 能夠把"單獨屬性"的權重變為無限大。 盡量少用。

html&scc基礎知識