HTML和CSS第一課

2021-10-17 09:48:00 字數 2145 閱讀 3629

網頁版本

文件申明(當前版本)

html5的文件宣告

都大寫也可以,寫在第一行html外面

!+tab標籤快捷鍵

ctrl+\注釋的快捷鍵

外掛程式:live server右鍵開啟網頁 、auy主題

內容+tab快速出來標籤

相關標籤可以放在一起
在頁面中不會獨佔一行的元素為行內元素

strong標籤表示元素語義加重

blockquote 表示乙個長引用 有縮排的效果

屬於塊元素

q表示乙個短引用 自動加引號

br標籤表示換行

注意:塊元素基本什麼都能放但是p元素中不能放塊元素。

錯誤會在開發者工具裡糾正 f12或右鍵檢查結構化語義標籤

注意標籤與網頁的相容性

結構

表現行為

使用a標籤來定義超連結 (行內元素)

屬性:eg:

超連結1

超連結2

ctrl+a全選

ctrl+/注釋

內部樣式表外部樣式表

外部.css檔案中

id選擇器#

class選擇器

通配選擇器

交集選擇器

並集選擇器

關係選擇器

子元素選擇器

後代元素選擇器

兄弟選擇器

屬性選擇器

偽類選擇器

描述元素的特殊狀態(從所有子元素裡找)

找同型別的

否定偽類

a元素的偽類

a:link{}(link表示沒訪問過的鏈結)
a:visited{}(vistised表示訪問過的鏈結)
為元素選擇器

權重

內聯樣式 1,0,0,0

id選擇器 0,1,0,0

類和偽類選擇器 0,0,1,0

元素選擇器 0,0,0,1

通配選擇器 0,0,0,0

繼承樣式 沒有優先順序

在乙個樣式後面加!important 最高組成:

內邊距

邊框

邊框顏色border-color

邊框樣border-style:

外邊距影響盒子位置

四個方向:

margin-top

上外邊距,設定正值,元素向下移。左外邊距,設定正值,右移

設定左上是移動自己

border-top: 10xp solid red;
如果某個值為auto,則會自動調整為auto的那個值使等式成立

如果將乙個寬度和乙個外邊距設定為auto,則外邊距為0,寬度最大

如果三個值都設定為auto,則外邊距都是0,寬度最大

如果將兩個外邊距設定為auto,寬度固定值,則會將外邊距設定為相同值

所以我們經常利用這個特點來使乙個元素在其父元素中水平居中

overflow-x:

overflow-y:

父子元素

visbility

*
只需要引入去除瀏覽器樣式

重置樣式表》

box-shadow:設定元素陰影效果不影響布局

border-radius 設定圓角

!浮動

html 基礎第一課

快捷鍵 1 ctrl 快速新增單行注釋 2 ctrl shift 快速新增多行注釋 3 ctrl d 快速刪除游標所在的一行 4 ctrl y 反撤銷 5 ctrl alt 下方向鍵 快速複製並貼上當前行 標籤的屬性 標籤的一部分,用於包含額外的資訊,可以有多個屬性 屬性與屬性值成對出現 關鍵字 d...

HTML入門第一課

html hyper text markup language 稱為超文字標記語言,是一種標識性的語言。它包括一系列標籤 通過這些標籤可以將網路上的文件格式統一,使分散的internet資源連線為乙個邏輯整體。根據個人的理解,可以簡單地將html理解為一種特殊的文件,瀏覽器可以依據文件的標籤,將其解...

前端學習第一課 HTML

學習網路前端知識的第一課,使用了一些html常用標籤,並簡單應用了下css主題設定。來記錄下自己的第一段html 第乙個html頁面 六級標題,小到看不到。這是乙個段落。強調文字 這是一條被刪除的文字。bold text黑體文字 italic text美麗的義大利斜體 emphasized text...