html常用
1. html中常用的表單元素
HTML中常用的表單元素有datalist、keygen、output。
1、datalist
datalist元素規定輸入域的選項列表。列表通過datalist內的option元素創建的。
如需把datalist綁定到輸入域,用輸入域的list屬性引用datalist的id。
2、keygen
keygen元素的作用為提供一種驗證用戶的可靠方法。keygen元素為密鑰對生成器(key-pair generator)。當提交表單時,會生成兩個鍵,一個是私鑰,一個公鑰。
私鑰(private key)存儲於客戶端,公鑰(public key)則被發送到伺服器。公鑰可用於之後驗證用戶的客戶端證書(client certificate)。
3、output
output元素用於不同類型的輸出,比如計算或腳本輸出。
(1)html常用擴展閱讀
一個網頁對應多個HTML文件,超文本標記語言文件以.htm(磁碟操作系統DOS限制的外語縮寫)為擴展名或.html(外語縮寫)為擴展名。可以使用任何能夠生成TXT類型源文件的文本編輯器來產生超文本標記語言文件,只用修改文件後綴即可。
標準的超文本標記語言文件都具有一個基本的整體結構,標記一般都是成對出現(部分標記除外例如:<br/>),即超文本標記語言文件的開頭與結尾標志和超文本標記語言的頭部與實體兩大部分。有三個雙標記符用於頁面整體結構的確認。
2. html中哪些元素比較常用的
<head>~</head>:頭標解釋
<title>~</title>:文本顯示標題
<script>~</script>:插入相應的腳本,可以是VBscript也可以是Javascript
<noscript>~<noscript>:插入禁止保存網站的項
<marquee>~</marquee>:插入移動字元
<a href=...>~〈/a>:插入超鏈接
<form action=...>~</form>:提交表單
<link href=...插入相關的CSS文件>
<style>~</style>:插入相應的圖標,比如滑鼠樣子圖標
<table>~<table>:插入顯示HTML的一個表格,需要class和id的屬性
<div>~</div>:定義顯示文本的位置,需要class和id的屬性
<font>~</font>:文字顏色和大小布局
<p>~</p>:文欄位
<input />:輸入表格屬性,一般分為name和password兩種。
上面都是些常用的,還有更多的沒有列舉出來。
參考資料:http://www.gzsums.e.cn/webclass/html/html_design.html
3. 什麼是html屬性,html常用的屬性有哪些
所謂html屬性,指的就是各個標簽所具有的屬性
最為常見的屬性包括:id、class、name、style、type、value等
不同的標回簽還有各自答的專屬屬性,比如表格元素所專用的 colspan rowspan
html屬性是書寫於標簽當中的,如:
<inputtype="text"name=""id="">
input是標簽名,而type、name、id都是這個標簽的屬性
當然,用戶還可以自定義屬性。
如果是新手學習HTML5,建議弄本書把基礎知識打扎實,推薦看看《HTML5布局之路》學習一下
4. html常用的字體樣式
font-family:'Microsoft YaHei'。
1、網頁字體樣式華文黑體:STHeiti
2、網頁字體樣式華文楷體:STKaiti
3、網頁字體樣式華文宋體:STSong
4、網頁字體樣式華文仿宋:STFangsong
5、網頁字體樣式黑體:SimHei
6、網頁字體樣式宋體:SimSun
7、網頁字體樣式新宋體:NSimSun
8、網頁字體樣式仿宋:FangSong
9、網頁字體樣式楷體:KaiTi
10、網頁字體樣式仿宋_GB2312:FangSong_GB2312
11、網頁字體樣式楷體_GB2312:KaiTi_GB2312
12、網頁字體樣式微軟正黑體:Microsoft JhengHei
13、網頁字體樣式微軟雅黑體:Microsoft YaHei
14、網頁字體樣式隸書:LiSu
15、網頁字體樣式幼圓:YouYuan
16、網頁字體樣式華文細黑:STXihei
17、網頁字體樣式華文楷體:STKaiti
18、網頁字體樣式華文宋體:STSong
19、網頁字體樣式華文中宋:STZhongsong
20、網頁字體樣式華文仿宋:STFangsong
21、網頁字體樣式方正舒體:FZShuTi
22、網頁字體樣式方正姚體:FZYaoti
23、網頁字體樣式華文彩雲:STCaiyun
24、網頁字體樣式華文琥珀:STHupo
25、網頁字體樣式華文隸書:STLiti
26、網頁字體樣式華文行楷:STXingkai
27、網頁字體樣式華文新魏:STXinwei
(4)html常用擴展閱讀
html內容描述
<h1></h1> 最大的標題(一號標題)
<pre></pre> 預先格式化文本 (英文全稱:PREformatted)
<u></u> 下劃線(英文全稱:Underline)
<b></b> 黑體字 (英文全稱:Bold)
<i></i> 斜體字 (英文全稱:Italics)
<tt></tt>打字機風格的字體
<cite></cite>引用,通常是斜體
<em></em> 強調文本(通常是斜體加黑體、英文全稱:EMphasize)
<strong></strong> 加重文本(通常是斜體加黑體)
<font size="" color=""></font> 設置字體大小從1到7,顏色使用名字或RGB(中文全稱:紅綠藍)的十六進制值
<BASEFONT></BASEFONT>基準字體標記
<big></big> 字體加大
<SMALL></SMALL> 字體縮小
<DELECT></DELECT> 加刪除線
<CODE></CODE>程式碼
<KBD></KBD>鍵盤字(英文全稱:KeyBoarD)
<SAMP></SAMP> 範例(英文全稱:SAMPle)
<VAR></VAR> 變數(英文全稱:VARiable)
<BLOCKQUOTE></BLOCKQUOTE> 向右縮排(向右縮進、塊引用)
<DFN></DFN> 述語定義(英文全稱:DeFiNe)
<ADDRESS></ADDRESS>地址標記
<sup></SUP> 上標字 (英文全稱:SUPerscript)
<SUB></SUB> 下標字(英文全稱:SUBscript)
<xmp>...</xmp>;固定寬度字體(在文件中空白、換行、定位功能有效)
<plaintext>...</plaintext>;固定寬度字體(不執行標記符號)
<listing>...</listing> 固定寬度小字體
<font color=00ff00>...</font>;字體 顏色
<font size=1>...</font>;字體 大小等於1(最小)。
<font style ='font-size:100 px'>...</font>;字體 樣式等於無限增大(100像素)
5. html常用標簽有哪些
<html></html> 創建一個HTML文檔
<head></head> 設置文檔標題和其它在網頁中不顯示的信息
<title></title> 設置文檔的標題
<body> </body>標記頁面正文網頁中要顯示出來的東東,都應放在這對標簽之間
<h1></h1> 最大的標題
<pre></pre> 預先格式化文本
<u></u> 下劃線
<b></b> 黑體字
<i></i> 斜體字
<tt></tt> 打字機風格的字體
<cite></cite> 引用,通常是斜體
<em></em> 強調文本(通常是斜體加黑體)
<strong></strong> 加重文本(通常是斜體加黑體)
<font size="" color=""></font> 設置字體大小從1到7,顏色使用名字或RGB的十六進制值
<BASEFONT></BASEFONT> 基準字體標記
<big></big> 字體加大
<SMALL></SMALL> 字體縮小
<STRIKE></STRIKE> 加刪除線
<CODE></CODE> 程式碼
<KBD></KBD> 鍵盤字
<SAMP></SAMP> 範例
<VAR></VAR> 變數
<BLOCKQUOTE></BLOCKQUOTE> 向右縮排
<DFN></DFN> 述語定義
<ADDRESS></ADDRESS> 地址標記
<sup></SUP> 上標字
<SUB></SUB> 下標字
<xmp>...</xmp>;固定寬度字體(在文件中空白、換行、定位功能有效)
<plaintext>...</plaintext>;固定寬度字體(不執行)
<listing>...</listing> 固定寬度小字體
<font color=00ff00>...</font>;字體顏色
<font size=1>...</font>;最小字體
<font style =':100 px'>...</font>;無限增大格式標志標簽
<p></p> 創建一個段落
<p align=""> 將段落按左、中、右對齊
<br>換行 插入換行符
<blockquote></blockquote> 從兩邊縮進文本
<dl></dl> 定義列表
<dt> 放在每個定義術語詞前<dd> 放在每個定義之前
<ol></ol> 創建一個標有數字的列表
<ul></ul> 創建一個標有圓點的列表<li> 放在每個列表項之前,
<div align=""></div> 用來排版大塊
HTML段落,也用於格式化表
<MENU> 選項清單
<DIR> 目錄清單
<nobr></nobr> 強行不換行
<hr size='9' width='80%' color='ff0000'>水平線(設定寬度)
<center></center> 水平居中鏈接標志表格標志
<a href="URL"></a> 創建超文本鏈接
<a href="mailtEMAIL"> ……< /a> 創建自動發送電子郵件的鏈接
<a name="name"></a> 創建位於文檔內部的書簽
<a href="#name"></a> 創建指向位於文檔內部書簽的鏈接
<BASE> 文檔中不能被該站點辨識的其它所有鏈接源的URL< LINK>
6. 程序員必須知道的HTML常用代碼有哪些
html+css代碼
一、文本設置
1、font-size:號大小
2、font-style:字體格式
3、font-weight:字體粗細
4、顏色屬性color:文本顏色
二、超鏈接設置
text-decoration:參數
參數取值范圍:
underline:為文字加下劃線
overline:為文字加上劃線
line-through:為文字加刪除線
blink:使文字閃爍
none:不顯示上述任何效果
三、背景
1、背景顏色
background-color:設置背景色
2、背景圖片
background-image:url(URL)
URL就是背景圖片的存放路徑,none表示無。
3、背景圖片重復
background-repeat:參數
四、背景
repeat:不重復平鋪背景圖片
repeat-x:使圖片只在水平方向上平鋪
repeat-y:使圖片只在垂直方向上平鋪
如果不指定背景圖片重復屬性,瀏覽器默認的是背景圖片向水平和垂直兩個方向平鋪。
4、背景圖片固定
background-attachment:參數
背景圖片固定控制背景圖片是否隨網頁的滾動而滾動。如果不設置背景圖片固定屬性,瀏覽器默認背景圖片隨網頁的滾動而滾動。為了避免過於花哨的背景圖片在滾動時轉移瀏覽者的注意力,一般都設為固定。
五、參數取值范圍:
fixed:網頁滾動時,背景圖片相對於瀏覽器的窗口而言,固定不動。
scroll:網頁滾動時,背景圖片相對於瀏覽器的窗口而言,一起滾動。
六、區塊
1、單詞間距
word-spacing:單詞間距
2、字母間距
letter-spacing:字母間距
3、文本對齊
text-align:參數
七、參數的取值:
left:左對齊
right:右對齊
center:居中對齊
justify:相對左右兩端對齊
4、垂直對齊
vertical-align: 參數
top:頂對齊
bottom:底對齊
text-top:相對文本頂對齊
text-bottom:相對文本底對齊
baseline:基準線對齊
middle:中心對齊
sub:以下標的形式顯示
super:以上標的形式顯示
5、文本縮進
text-indent:縮進距離
12px相當於一個文字距離。
6、空格
white-space:參數
八、參數取值范圍:
normal默認,空白會被瀏覽器忽略、pre保留空白、nowrap文本不換行。
7、顯示樣式
display:參數
九、參數取值范圍:
block:塊級元素,在對象前後都換行
inline:在對象前後都不換行
list-item:在對象前後都換行,增加了項目符號
none:無顯示
十、方框
1、height高度
2、width寬度
3、padding內邊距
4、margin外邊距
5、float(浮動):可以讓塊級元素在一行中排列,例如橫向菜單。
6、clear清除浮動
十一、邊框
1、樣式
border style 參數
邊框樣式的參數:
none:無邊框
dotted:邊框為點線
dashed:邊框為長短線
solid:邊框為實線
double:邊框為雙線
2、寬度 border width
3、顏色 border color
(6)html常用擴展閱讀:
HTML常用代碼之修改頁面的實用性HTML代碼:
貼圖:<img src="圖片地址">
加入連接:<a href="所要連接的相關地址">寫上你想寫的字</a>
在新窗口打開連接:<a href="相關地址" target="_blank">寫上要寫的字</a>
移動字體(走馬燈):<marquee>寫上你想寫的字</marquee>
字體加粗:<b>寫上你想寫的字</b>
字體斜體:<i>寫上你想寫的字</i>
字體下劃線: <u>寫上你想寫的字</u>
字體刪除線: <s>寫上你想寫的字</s>
字體加大: <big>寫上你想寫的字</big>
字體控制大小:<h1>寫上你想寫的字</h1> (其中字體大小可從h1-h5,h1最大,h5最小)
更改字體顏色:<font color="#value">寫上你想寫的字</font>(其中value值在000000與ffffff(16位進制)之間
消除連接的下劃線:<a href="相關地址" style="text-decoration:none">寫上你想寫的字</a>
貼音樂:<embed src="音樂地址" width="寬度" height="高度" autostart=false>
貼flash: <embed src="flash地址" width="寬度" height="高度">
貼影視文件:<img dynsrc="文件地址" width="寬度" height="高度" start=mouseover>
換行:<br>
段落:<p>段落</p>
原始文字樣式:<pre>正文</pre>
換帖子背景:<body background="背景圖片地址">
固定帖子背景不隨滾動條滾動:<body background="背景圖片地址" body bgproperties=fixed>
定製帖子背景顏色:<body bgcolor="#value">(value值見10)
帖子背景音樂:<bgsound="背景音樂地址" loop=infinite>
貼網頁:<iframe. src="相關地址" width="寬度" height="高度"></iframe>
7. html常用哪些標簽
html中的標簽有許多自,但是常用的有以下幾個:
<form>:前台向後台提交請求時用到的標簽
<a>:超鏈接,也用於提交請求
<br>:定義簡單的折行。
<button>:按鈕。一般和事件一起用
<select>:定義選擇列表(下拉列表)。
<style>:定義文檔的樣式信息。
<table><tr><th><td>:一起用,常用於展示數據的格式
其他的也有用到,可以慢慢積累。
8. 常用的HTML代碼
常用HTML代碼解釋
一、文字
1.標題文字 <h#>..........</h#> #=1~;h1為最大字,h6為最小字
2.字體變化 <font>..........</font>
【1】字體大小 <font size=#>..........</font> #=1~7;數字愈大字也愈大
【2】指定字型 <font face="字體名稱">..........</font>
【3】文字顏色 <font color=#rrggbb>..........</font>
rr:表紅色(red)色碼
gg:表綠色(green)色碼
bb:表藍色(blue)色碼
rrggbb也可用6位顏色代碼數字
3.顯示小字體 <small>..........</small>
4.顯示大字體 <big>..........</big>
5.粗體字 <b>..........</b>
6.斜體字 <i>..........</i>
7.打字機字體 <tt>..........</tt>
8.底線 <u>..........</u>
9.刪除線 <strike>..........</strike>
10.下標字 <sub>..........</sub>
11.上標字 <sup>..........</sup>
12.文字閃爍效果 <blink>..........</blink>
13.換行(也稱回車) <br>
14.分段 <p>
15.文字的對齊方向 <p align="#"> #號可為 left:表向左對齊(預設值) center:表向中對齊 right:表向右對齊 P.S.<p align="#">之後的文字都會以所設的對齊方式顯示,直到出現另一個<p align="#">改變其對齊方向,遇到<hr>或<h#>標簽時會自動設回預設的向左對齊。
16.分隔線 <hr>
【1】分隔線的粗細 <hr size=點數>
【2】分隔線的寬度 <hr size=點數或百分比>
【3】分隔線對齊方向 <hr align="#">
#號可為 left:表向左對齊(預設值) center:表向中對齊 right:表向右對齊
【4】分隔線的顏色 <hr color=#rrggbb>
【5】實心分隔線 <hr noshade>
17.居中對齊 <center>..........</center>
18.依原始樣式顯示 <pre>..........</pre>
19.<body>指令的屬性
【1】背景顏色 -- bgcolor <body bgcolor=#rrggbb>
【2】背景圖案 -- background <body background="圖形文件名">
【3】設定背景圖案不會卷動 -- bgproperties <body bgproperties=fixed>
【4】文件內容文字的顏色 -- text <body text=#rrggbb>
【5】超連結文字顏色 -- link <body link=#rrggbb>
【6】正被選取的超連結文字顏色 -- vlink <body vlink=#rrggbb>
【7】已連結過的超連結文字顏色 -- alink <body alink=#rrggbb>
20.文字移動指令<MARQUEE>..........</MARQUEE>
移動速度指令是:scrollAmount=# #最小為1,速度為最慢;數字越大移動的越快。
移動方向指令是:direction=# up向上、down向下、left向左、right向右。
指令舉例:<MARQUEE scrollAmount=3 direction=up>..........</MARQUEE>
二、圖片
1.插入圖片 <img src="圖形文件名">
2.設定圖框 -- border <img src="圖形文件名" border=點數>
3.設定圖形大小 -- width、height <img src="圖形文件名" width=寬度點數 height=高度點數>
4.設定圖形上下左右留空 -- vspace、hspace <img src="圖形文件名" vspace=上下留空點數 hspace=左右留空點數>
5.圖形附註 <img src="圖形文件名" alt="說明文字">
6.預載圖片
<img src="高解析度圖形文件名" lowsrc="低解析度圖形文件名"> P.S.兩個圖的圖形大小最好一致;
7.影像地圖(Image Map) <img src="圖形文件名" usemap="#圖的名稱"> <map name="圖的名稱">
<area shape=形狀 coords=區域座標列表 href="連結點之URL">
<area shape=形狀 coords=區域座標列表 href="連結點之URL">
<area shape=形狀 coords=區域座標列表 href="連結點之URL">
<area shape=形狀 coords=區域座標列表 href="連結點之URL"> </map>
【1】定義形狀 -- shape
shape=rect:矩形 shape=circle:圓形 shape=poly:多邊形
【2】定義區域 -- coords
a.矩形:必須使用四個數字,前兩個數字為左上角座標,後兩個數字為右下角座標
例:<area shape=rect coords=100,50,200,75 href="URL">
b.圓形:必須使用三個數字,前兩個數字為圓心的座標,最後一個數字為半徑長度
例:<area shape=circle coords=85,155,30 href="URL">
c.任意圖形(多邊形):將圖形之每一轉折點座標依序填入
例:<area shape=poly coords=232,70,285,70,300,90,250,90,200,78 href="URL"
三、表格相關
1.表格標題
<caption>..........</caption>
表格標題位置 -- align
<caption align="#"> #號可為 top:表標題置於表格上方(預設值)
bottom:表標題置於表格下方
2.定義列 <tr>
3.定義欄位 《1》<td>:靠左對齊
《2》<th>:靠中對齊ⅱ粗體
【1】水平位置 -- align <th align="#">
#號可為 left:向左對齊 center:向中對齊 right:向右對齊
【2】垂直位置 -- align <th align="#"> #號可為
top:向上對齊 middle:向中對齊 bottom:向下對齊
【3】欄位寬度 -- width <th width=點數或百分比>
【4】欄位垂直合並 -- rowspan <th rowspan=欲合並欄位數>
【5】欄位橫向合並 -- colspan <th colspan=欲合並欄位數>
四、表格的主要屬性
1. <table>標記的主要屬性
align定義表格的對齊方式,有三個屬性值center,left,right
background定義表格的背景圖案,屬性值為圖片的地址
bgcolor定義表格的背景顏色,屬性值是各種顏色代碼
border定義表格的邊框寬度,屬性值是數字
bordercolor定義表格邊框的顏色,屬性值是各種顏色代碼
cellpadding定義單元格內容與單元格邊框之間的距離,屬性值是數字
cellspacing定義表格中單元格之間的距離
height定義表格的高度,屬性值是數字
width定義表格的寬度,屬性值是數字
2. <tr>標記,表格是由多行與多列組成的,<tr>標記用來定義表格的一行,他的屬性極其屬性值定義的是表格中的該行,其主要屬性與屬性值如下:
align定義對齊方式,屬性值與上同
background定義背景圖案 bgcolor定義背景色
3. <td>標記。用<td>標記概況起來的內容表示表格的單元。其主要屬性與屬性值和<table>標記的一樣,補充兩個合並列和行的代碼:
colspan定義合並表格的列數,屬性值是數字
rowspan定義合並表格的行數,屬性值是數字
五、FRAME
1、分割視窗指令 <frameset>..........</frameset>
【1】垂直(上下)分割 -- rows
<frameset rows=#> #號可為點數:
如欲分割為100,200,300三個視窗,則<frameset rows=100,200,300>;
亦可以*號代表,如<frameset rows=*,500,*>
百分比:如<frameset rows=30%,70%>,各項總和最好為100%;
【2】水平(左右)分割 -- cols <frameset cols=點數或百分比>
2、指定視窗內容 -- <frame>
<frameset cols=30%,70%> <frame> <frame> </frameset>
【1】指定視窗的文件名稱 -- src <frame src=HTML檔名>
【2】定義視窗的名稱 -- name
<frame name=視窗名稱>
【3】設定文件與上下邊框的距離 -- marginheight
<frame marginheight=點數>
【4】設定文件與左右邊框的距離 -- marginwidth
<frame marginwidth=點數>
【5】設定分割視窗卷軸 -- scrolling
<frame scrolling=#> #號可為 yes:固定出現卷軸
no:不出現卷軸
auto:自動判斷文件大小需不需要卷軸(預設值)
【6】鎖住分割視窗的大小 -- noresize <frame noresize>
六、歌曲代碼:
在這組代碼中,不必管它是mms.http.rtsp,只要看尾綴是asf、wma、wmv、wmv、rm都可適用下面的代碼:
1. 手動播放:
<EMBED src=歌曲地址 volume="100" width=39 height=18 hidden="FALSE" autostart="fault" type="audio/x-pn-realaudio-plugin" controls="PlayButton">
2. 打開頁面自動播放:
<EMBED src="歌曲地址" width="39" height="18" autostart="true" hidden="false" loop="infinite" align="middle" volume="100" type="audio/x-pn-realaudio-plugin" controls="PlayButton" autostart="true">
------------------------------------------------------------------
套用代碼:
<div align="center">
<table border="1" width="90%" height="403" background="背景圖片地址">
<tr><td width="80%" height="100%">
<p align="center"><br><br><br>
<font face="華文彩雲" size="6" color="#FFFFFF">歌曲或音樂名稱</font><br><br>
<p align="center"><img src="圖片地址"><br><br>
<font color="#FFFFFF" size=3>介紹文字</font><br><br><br>
<EMBED style="FILTER: xray()" src=音樂地址 width=250 height=30 type=audio/x-ms-wma autostart="true" loop="-1"><br><br><br>
</td></tr>
</table>
</div>
簡易套用代碼詳解:
<div align="center">是定義帖子居中;
<table border="1" width="90%" height="403" background="背景圖片地址"><tr><td width="80%" height="100%">
這其中的border="1"是定義表格邊線的寬度,定義為0則無邊線;width="90%" height="403"分別定義背景圖表格的寬度和高度.如果背景圖是一張大圖,可以這樣定義:width=圖片寬度 height=圖片高度
<p align="center"><br><br><br><font face="華文彩雲" size="6" color="#FFFFFF">歌曲或音樂名稱</font><br><br>
<p align="center">是定義文字居中的,<br>是回行代碼,加幾個就會空幾行。<font face="華文彩雲" size="6" color="#FFFFFF">是定義文字屬性的。face="華文彩雲"是定義字體,你可以把字體換成隸書、宋體等。size="6"是定義字型大小的,數字越大字越大,如果不定義,默認是2號字。color="#FFFFFF"是定義字體顏色的。全部字體顏色的代碼在妙手飾圖區有人發過,你可以找來改。
<p align="center"><img src="圖片地址"><br><br><font color="#FFFFFF">介紹文字</font><br><br><br>
第一個括弧里的代碼仍然是定義圖片和文字居中的。<img src="圖片地址">是插入圖片代碼。<font color="#FFFFFF" size=3>介紹文字</font>是定義這段文字的。如果想改變字擰⒆痔濉⒆值難丈
9. 介紹幾個常用的HTML5標簽
一、Html的基本結構:
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8">
<title></title>
</head>
<body>
網頁的文本、圖片等信息;
</body>
</html>
二、Head部分:用於表示網頁的元數據即描述網頁的基本信息
其常用標簽及屬性有:
1、title標簽:瀏覽器標簽頁顯示的標題
2、meta標簽:其常用屬性
①charset:設置文檔的字元集編碼格式。HTML5中設置字元集編碼:<meta charset="UTF-8">
常見的字元集編碼格式:
a.GB-2312:國標碼,簡體中文
b.GBK:擴展的國標碼
c.UTF-8:萬國碼 Unicode 常用
②http-equiv屬性:將我們的信息寫給瀏覽器看,讓瀏覽器按照這裡面的要求執行,可選屬性值:Content-Type(文檔類型)refresh(網頁定時刷新)set-cookie(設置瀏覽器cookie緩存) 需要配合content屬性使用。(http-equiv屬性只是表明需要設置哪一部分,具體的設置內容,放到content屬性中)
③name屬性:使用方法同「http-equiv」。將我們的信息寫給搜索引擎看
常用且需要掌握的屬性值:author(作者)keywords(網頁關鍵字)description(網頁描述) 這兩個屬性設置,網頁必不可少。
3、link標簽:鏈接網頁圖標(title前的小logo),其常用屬性有:
①rel屬性:聲明鏈接文件的類型,此處選icon
②type屬性:可以省略
③href屬性:表示圖片的路徑地址
三、body部分:網頁的文本、圖片等信息
標簽的分類:
塊級標簽:顯示為塊,前後隔一行(自動換行)
行級標簽:按行從左往右逐一顯示。
1、 常見的塊級標簽:
①<h1></h1>......<h6><h6>:標題標簽,自動加粗,h1最大,h6最小。
②<hr/>:水平線標簽,添加一條水平線。
③<p></p>:段落標簽,
④<br/>:換行標簽,
⑤<blockquote/></blockquote>:引用標簽,cite屬性,表明引用的來源,一般引用網址
瀏覽器默認首行縮進。
⑥<pre></pre>:預格式標簽,用於重載代碼。瀏覽器默認顯示樣式:1、顯示為等寬字體。 2、代碼中的換行、
空格等元素能在瀏覽器中顯示。
【補充】html 文件中空格的表示:
2、 基於布局的塊級標簽
列表:無序列表、有序列表、定義列表
①有序列表:<ol></ol> 列表項:<li></li>
②無序列表:<ul></ul> 列表項:<li></li>
③定義列表(實現圖文混排):<dl></dl>
列表標題:<dt>一般只有一項</dt>
列表描述項:<dd>可以有很多項</dd>
3、組合標簽:<figure></figure>用於顯示圖片及圖片標題
他有兩個子標簽:<img />圖片
<figcaption></figcaption>圖片的標題
例如:<figure>
<img src="img/EZ.jpg" height="20%" width="20%" alt="探險家"/>
<figcaption>探險家 伊澤瑞爾</figcaption>
</figure>
4、分區標簽:<div></div>
5、常見的行級標簽
<1>span(文本):無實際意義,用於包裹某部分文字,修改特定樣式,例如:
這是<span style="color: red;font-size: 36px;">span</span>中的文字
img(圖片):其常用屬性:①src:表示引用圖片的地址。
路徑地址的寫法:相對路徑:以當前文件為最准,去尋找圖片地址
a、與文件處於同一層的圖片,直接寫圖片名
b、圖片在當前文件下一層:文件名/圖片名
c、圖片在當前文件上一層:../圖片名
絕對路徑:file:///盤符:/文件夾/圖片名,但 是嚴禁使用
圖片網址:網路上的圖片鏈接,但是一般不用
②height和width:圖片的高度和寬度。可以用CSS樣式代替
③title:圖片標。當滑鼠指上之後顯示的文字
④alt:當圖片無法顯示的時候,顯示的文字
<2>em(傾斜強調)
<3>strong(加粗強調)
<4>b(加粗)
<5>i(傾斜)
Strong、em、b、i的區別
1、Strong、em都表示強調,Strong為粗體,em為斜體,而Strong的強調 程度逗比em高
2、Strong和b都能加粗,em和i都能傾斜,,但是Strong和em多了一層強調的語義 。H5要求標簽盡可能實現語義化。
<6>q(短引用)
<7>small/big(縮小/放大字體):small和big分別是縮小和擴大字體,都可以多層嵌套直至上限或下限
<8>a(超鏈接)
1、href:超鏈接的路徑,可以是網路鏈接,也可以是本地文件。
2、target:跳轉頁面打開的位置。_self自身頁面,_blank新頁面。
3、title:滑鼠指在超鏈接上顯示的名稱。
4、Rel(被鏈接是當前的前/後一篇):指定被鏈接文檔與當前文檔的關系,搜索引擎 會利用該屬性 獲取更多的有關鏈接的信息:
rel="prev"被鏈接文檔是當前文檔的前一篇文 檔,
rel="next"被鏈接文檔是當前文檔的後一篇文檔,
rel="icon"被鏈接文檔是當前文檔的圖標
rel="stylesheet"被鏈接文檔是當前文檔的樣式表
5、Rev(當前是被鏈接的前/後一篇)
錨鏈接:
①本頁面錨鏈接:a、設置錨點:<a name="top"></a>
b、跳轉錨點:#name名
①頁面間錨鏈接:a、在即將跳轉頁面的指定位置設置錨點
b、跳轉錨點:頁面地址.html#name名
<a href="02_常見的塊級標簽.html#Hbuilder">頁面間錨鏈接</a><br/>
功能性鏈接: mailto用於給指定郵箱發送郵件
file:///e:/aaa.png打開本地文件
tencent://message/?uin=1315618220 給指定QQ發送息
<9>s標簽,有誤文本:刪除線
<s>這是S標簽中的文字</s><br />
<10>cite標簽:瀏覽器顯示為傾斜,常用於書、畫作、作品的引用
<cite>這是cite中的文本</cite><br />
<11>code:計算機代碼,不保留代碼格式
<pre>
<code></code>
</pre>
<12>bdo:表示文本方向,屬性:dir="ltr"表示從左往右,dir="rtl"表示從右往左
<bdo dir="rtl">1234567</bdo><br />
kbd:表示需要用戶用鍵盤輸入的內容,瀏覽器顯示為等寬字體
請輸入「<kbd>Esc</kbd>」推遲系統<br />
<13>sup:上標文本,sub:下標文本
x<sub>6</sub><br />
© &; 空格
© &; 空格 <br />
<14>u:下劃線
<u>這是下劃線</u><br />
mark:高亮或標記文本,瀏覽器顯示為黃色背景
<mark>mark</mark><br />