HTML初級知識

2021-08-14 10:21:29 字數 2019 閱讀 7445

html初級知識及技巧

html語法結構分為!doctype部分,head部分和body部分;!doctype部分的功能是告訴瀏覽器這個html檔案該按那個版本解析;head部分的功能是定義頁面和其元素的相關屬性,標籤裡面的引數一般用於告訴瀏覽器解析前的配置,這些配置一般可以通過meta(元標籤)標籤來配置。body部分為網頁的主體部分,頁面上需要呈現的內容都寫在這一部分。乙個簡單的 html文件,擁有盡可能少的必需的標籤。

告訴瀏覽器按html的哪個版本來解析你的檔案html ,html發展至今已經是第五個版本了,那麼瀏覽器怎麼知道你想讓它按哪個版本來解析呢?沒錯,就是通過這個標籤來實現。這句**的意思是

瀏覽器按照html5這個版本解析,讓瀏覽器按照不同版本解析後面接不同**,這裡不一一例舉。這句**表示頁面編碼方式按utf-8,中文頁面一般用utf-8,因為utf-8可以編碼中文,head部分還包括seo優化,seo優化通俗的講就是在別人搜尋相關網頁的時候讓你的網頁盡量靠前,下面介紹兩個**

和。第一keywords,在content中寫入你的**關鍵字,那麼在別人搜尋網頁時,如果輸入關鍵字和你的網頁關鍵字相似度很高那麼你的網頁就靠前顯示;在content中寫入**的描述,其功能和keyword一樣,用於設定頁面標題,將標題用titie標籤包住如——設定頁面標題

圖 1 hbuilder的開發介面及html的結構

根據排版的需要,我們需要把標籤分成兩部分。一種是塊標籤,一種是行內標籤。

塊元素的兩大特點:

1.獨佔一行(不管內容是不是一行,塊標籤都佔據一行)

2.可以設定寬高的

塊標籤有div,h1-h6,ol,ul,dl,table

div:div是無語義標籤(沒有任何標籤意義),一般作為容器使用,主要用於布局。

無語義是相對於有語義來說的。

h1-h6:用於顯示標題

輔助快捷鍵(hbuilder)

ol>li+tab

ol>li*3+tab

div*3 + tab

ol:有序列表

ul:無序列表

dl:定義列表

table:**,**是由行構成的,行是由列(單元格)構成的

具體用法可查問度娘,示例table用法

111222333

444

111222

333444

(table支援合併單元格操作)

行內標籤:

1.在一行內顯示,如果一行中的剩餘空間不足,行內標籤會被擠到下面一行顯示

2.內容撐開寬高,不能設定寬高。

預設情況下,行內標籤在一行內併排排列,預設多個行內標籤之間是有間隙的。這個間隙是如何形成的?

間隙是編寫**時由回車換行引起的(大家可以試一下輸入回車鍵和不輸入回車鍵span標籤之間的間隙)。

行內標籤有:

span

無語義標籤,一般作為容器使用。

img可以設定寬高的,那麼原因是什麼呢?因為img是可替換標籤。

可替換標籤:標籤顯示的內容是由屬性決定的,而不是由內容決定的標籤,我們稱之為可替換標籤,可替換標籤是可以設定寬高的。

(普通標籤)aaa

(可替換標籤)

表單相關

action:把表單提交到後台的處理程式

method:表單提交的方式,post提交,get提交

form是塊標籤

input相關(新增文字框,按鈕,點選勾選項。)

type:

text:文字框 password:密碼框 radio:單選功能(通過相同的name來實現單選)checkbox 核取方塊(通過相同的name來複選)file 檔案上傳 hidden 隱藏屬性  submit 按鈕  reset 重置  button 按鈕(不常用) textarea多行文字 select>option(selected)

通過這些標籤結合api文件你基本上可以做一些簡單的網頁布局了,對了順便提一句,建議使用chrome來執行除錯html文件。

Html初級知識總結

html初級知識 html不是程式語言,而是用來描述網頁結構的一種標記語言 簡單的說就是給展示在網頁上的文字加上表示文字含義的標籤,讓人們可以更好的理解 html5是定義html標準的最新版本,是乙個新的html語言,具有新的元素,屬性和行為 新增了一些改變,例如標籤語義化等。html標籤是成對出現...

C 初級知識

識別符號概念 識別符號是一種字串,用來命名如變數 方法 引數和許多後面要講解的程式結構。命名規則 1.字母 下劃線可以用在任何位置 2.數字不能放在首位 3.字元只能放在識別符號的首位 舉例 mydream 合法 77flower 不合法,不能以數字開頭 garden 合法 some6wordle ...

初級印刷知識

印刷品作為設計作品的最終實現,是設計師必須了解的流程。對於有個性的設計,如封面的覆膜,過油等效果可以使得封面顯得高檔 華貴。包括對紙張的運用,如封面與內頁用紙一般會使用的紙張型別就有所不同,宣傳冊與普通書籍紙張應用又有所不同。了解印刷流程對我們在設計中需要注意的問題也將有莫大的幫助。如封面紙張一般使...