屬性 HTML標簽可以設置屬性,屬性一般以鍵值對的方式寫在開始標簽中 1.HTML標簽除一些特定屬性外可以設置自定義屬性,一個標簽可以設置多個屬性用空格分隔,多個屬性不區分先後順序。 2.屬性值要用引號包裹起來,通常使用雙引號也可以單引號。 3.屬性和屬性值不區分大小寫,但是推薦使用小寫... ...
屬性
HTML標簽可以設置屬性,屬性一般以鍵值對的方式寫在開始標簽中
1.HTML標簽除一些特定屬性外可以設置自定義屬性,一個標簽可以設置多個屬性用空格分隔,多個屬性不區分先後順序。
2.屬性值要用引號包裹起來,通常使用雙引號也可以單引號。
3.屬性和屬性值不區分大小寫,但是推薦使用小寫。
為什麼html會有屬性呢?
這個舉個生活中的例子,你要在茫茫人海中找到你的女神,你依據什麼來找呢?肯定依據她身上的某個特征來找對吧?這個特征換個詞就是屬性,她特有的屬性,其他人沒有的對吧?比如她今天穿的紫色長裙,那麼你可以立馬鎖定女性,穿長裙,且裙子是紫色的人,這樣立馬就可以篩選掉一批人了對吧?然後你再根據你對你女神的瞭解,比如她走路的姿勢,身高,體型等等的,要不了多久你就可以找到你的女神了對吧。
那麼這裡web頁面的標簽也是,就是因為它有了它的屬性,第一,它的屬性會有一些功能幫助我們更好編寫web頁面,第二,它這些屬性我們在開髮網站的時候可以利用某個屬性來調整樣式,調整此標簽的行為等等的。
以上所述,就是會有屬性的原因
分類
HTML中標簽元素三種不同類型:塊狀元素,行內元素,行內塊狀元素
塊級元素特點:display:block;
- 每個塊級元素都從新的一行開始,並且其後的元素也另起一行。獨占一行
- 元素的高度、寬度、行高以及頂和底邊距都可設置。
- 元素寬度在不設置的情況下,是它本身父容器的100%(和父元素的寬度一致),除非設定一個寬度。
常用的塊狀元素:
<div> <p> <h1>~<h6> <ol> <ul> <table><form> <li>
行內元素特點:display:inline;
- 和其他元素都在一行上;
- 元素的高度、寬度及頂部和底部邊距不可設置;
- 元素的寬度就是它包含的文字或圖片的寬度,不可改變。
常用的行內塊狀元素:
<img> <input>
行內塊狀元素的特點:display:inline-block;
- 和其他元素都在一行上;
- 元素的高度、寬度、行高以及頂和底邊距都可設置
常用的行內元素
<a> <span> <br> <i> <em> <strong> <label>
註意:可以通過display屬性對塊級元素、行內元素、行內塊元素進行轉換,為後面頁面佈局做好了準備
嵌套
標簽與標簽之間也可以相互包含,或者說嵌套,但並不是任意嵌套,也有規則的:
- 塊元素可以包含內聯元素或某些塊元素
- 內聯元素卻不能包含塊元素,它只能包含其它的內聯元素
- 塊級元素不能放在p標簽裡面
- 有幾個特殊的塊級元素只能包含內嵌元素,不能再包含塊級元素,這幾個特殊的標簽是:
h1、h2、h3、h4、h5、h6、p
比如,li標簽里可以包含div,ul,ol標簽
如果還不太理解的話,看這個截圖:
這是淘寶網的html源碼
我標記出來的那裡就很好的提現標簽的嵌套關係,有興趣的可以自己再去看看
打開淘寶網,右鍵滑鼠,點檢查,有的瀏覽器叫審查元素,這個根據不同瀏覽器而異,這個技能我希望能學會,因為以後會經常會使用這個,這個的名字叫調試界面:
好的,html結構介紹完了,後面進入css介紹