TML標(biāo)簽:
所有內(nèi)容都在<html></html>標(biāo)簽之內(nèi);
<head></head>內(nèi)放的是頭部信息,是對(duì)頁面的描述,不會(huì)直接顯示在頁面中。
<head></head>內(nèi)的<title></title>中設(shè)置的是頁面的標(biāo)題,<title></title>只能放在<head></head>中;
<body></body>是頁面的主體,大部分顯示內(nèi)容都定義在這里。
HTML注釋:<!-- -->:
注釋不允許嵌套
html常用標(biāo)簽:
h標(biāo)簽(標(biāo)題),HTML定義了<h1></h1>到<h6></h6>六個(gè)h標(biāo)簽,分別表示不同大小的字體。h1最大,h6最小。
<br/>只是回車,<p>是段落。<p>前后會(huì)有比較大的空白,而<br/>則沒有。
<center>居中顯示.
<b>、<strong>粗體,<i>、<em>斜體。<u>下劃線。
<sub>2</sub>下標(biāo),如:H<sub>2</sub>O
<sup>2</sup>上標(biāo),如:10<sup>2</sup>
<font></font>字體標(biāo)簽,<font color=“red“ size=“7” face=“隸書”>紅色</font>。color(設(shè)置顏色) size(1-7) face(設(shè)置字體,設(shè)置字體是注意用戶計(jì)算機(jī)中必須有該字體才能正常顯示)
<hr> color size(厚度) width(長度) align=left/center/right (默認(rèn)為劇中顯示)
<pre> 預(yù)格式化 保持本色;
HTML特殊字符:<(小于號(hào),less than);>(大于號(hào),greater than); (空格)。
超鏈接:<a>標(biāo)簽的一些常用屬性:href、title、target、name
插入圖片:<img src=“路徑”/>
列表:dl→(定義列表),ul→(無序列表), ol→(有序列表)。
表格:<table>;創(chuàng)建行:<tr>;創(chuàng)建單元格:<td>;表頁眉:<thead>;表主體:<tbody>;表頁腳:<tfoot>;表頭:<th>。
rowspan(合并行)、colspan(合并列)
<input>是主要的表單元素,type的可選值:submit(提交按鈕)、button(普通按鈕)、checkbox表單標(biāo)簽:(復(fù)選框)、file(文件選擇框)、hidden(隱藏字段)、image(圖片按鈕)、password(密碼框)、radio(單選按鈕)、reset(重置按鈕)、text(文本框)。
meta標(biāo)簽:(包括在head標(biāo)簽中。主要用來描述頁面自身信息,元信息)
<meta name="keywords" content="C#學(xué)習(xí)資料,4k8k.net,.net開發(fā),軟件開發(fā),編程自學(xué)網(wǎng)"/>
<meta name="description" content="免費(fèi)更新最新C#相關(guān)技術(shù)知識(shí),主要包括:.net基礎(chǔ),網(wǎng)頁前端,三層架構(gòu),SQL數(shù)據(jù)庫..."/>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />網(wǎng)頁編碼
<meta http-equiv="Refresh" content="3" />三秒鐘后刷新此網(wǎng)頁。
<meta http-equiv="Refresh" content="3;url=http://www.4k8k.net" />三秒鐘后重定向到新網(wǎng)頁。
<meta http-equiv="Cache-Control" content="no-cache" /> 禁止瀏覽器緩存頁面。
<meta name="名字" content="值" />關(guān)于網(wǎng)頁的描述信息。
<meta http-equiv="名字" content="值" />模擬http響應(yīng)頭信息。
C#編程自學(xué)_做最好的.net自學(xué)資料站_更多文章請(qǐng)?jiān)L問:http://www.4k8k.net/
歡迎訂閱。
天是劉小愛自學(xué)Java的第76天。
感謝你的觀看,謝謝你。
話不多說,繼續(xù)html的學(xué)習(xí):
昨天學(xué)習(xí)了最基礎(chǔ)的文本標(biāo)簽及屬性,除此之外還有很多其它標(biāo)簽,今天逐一學(xué)習(xí)。
a標(biāo)簽有一個(gè)必不可少的屬性:href。href也就是超鏈接的意思。
下面編寫代碼,其中我每行之間用了兩個(gè)換行符(<br/><br/>),為了使頁面看起來相對(duì)而言更加美觀些。
①href="#"
作用是跳轉(zhuǎn)本頁面。
②href="對(duì)應(yīng)網(wǎng)頁鏈接地址"
作用是跳轉(zhuǎn)到對(duì)應(yīng)網(wǎng)頁。
③href="本地主頁"
這個(gè)呢是我自己電腦里面的一個(gè)html文件,自己可以訪問,但是別人就沒法訪問了。
②中的是只要網(wǎng)址能打開,所有人都能訪問。
④href="mailto:對(duì)應(yīng)郵箱地址"
作用是用本地的郵箱客戶端,給填寫的郵箱發(fā)送郵件。
⑤target="_self"
self,自身的意思,作用就是在當(dāng)前頁面中打開填入的網(wǎng)頁鏈接。
⑥target="_blank"
blank,空白的意思,作用就是在新窗口中打開填入的網(wǎng)頁鏈接。
⑦title="劉小愛的博客"
title,又是標(biāo)題,這里的作用是:當(dāng)我們將鼠標(biāo)放在當(dāng)前鏈接上的時(shí)候會(huì)出現(xiàn)一個(gè)標(biāo)題提示。
代碼編寫完畢,做一個(gè)測(cè)試:
其中有個(gè)小常識(shí):
左鍵直接點(diǎn)擊,會(huì)在當(dāng)前頁面中打開對(duì)應(yīng)鏈接。
Ctrl+左鍵點(diǎn)擊,會(huì)在新的頁面中打開對(duì)應(yīng)鏈接。
1圖片標(biāo)簽
image,圖像的意思,簡寫為img,圖片標(biāo)簽也就是用img來表示。
①src="圖片地址"
如果是本地圖片,寫出圖片所在的路徑即可。
如果是網(wǎng)絡(luò)圖片,寫出其對(duì)應(yīng)的鏈接即可。
其中width為寬度,height為高度,如果只設(shè)置其中一項(xiàng),高度和寬度是等比例縮放的。
當(dāng)然也可以寬度高度同時(shí)設(shè)置不同的值。
②alt="圖片丟失了啦"
如果圖片丟失了,就會(huì)顯示alt里面的內(nèi)容。
③title="我是劉小愛"
同a標(biāo)簽一樣,當(dāng)鼠標(biāo)放在該圖片上時(shí),會(huì)顯示title里的內(nèi)容。
2列表標(biāo)簽
list,即列表的意思,其中又分為有序列表和無序列表。
有序列表:ordered list,簡寫就是ol。
①type="1"
數(shù)字排序,這也是默認(rèn)的有序排序規(guī)則,所以可以省略不寫。
②type="a"
使用小寫字母排序,詳情見上圖。
③type="A"
使用大寫字母排序,詳情見上圖。
④type="Ⅰ"
使用羅馬字母排序,詳情見上圖。
⑤type="i"
使用字母i來排序,詳情見上圖。
無序列表:unordered list,簡寫就是 ul。
①type="disc"
disc,唱片、圓盤的意思,這是無序列表的默認(rèn)屬性,所以可以省略不寫。
②type="circle"
circle,圓形的意思。
③type="square"
square,正方形的意思。
1基本介紹
table,表格的意思,這在學(xué)數(shù)據(jù)庫時(shí)就接觸過。
tr,tablerow的縮寫,表示的是表格中的行。
td,tabledata的縮寫,表示的是表格中的數(shù)據(jù)。
①單元格:cell:細(xì)胞的意思,在表格中就表示為一個(gè)單元格。
②表格外邊框:border,邊界的意思,用其可以設(shè)置外邊框的粗細(xì)。
③單元格外間距:cellspacing,用其設(shè)定外間距。
④單元格內(nèi)間距:cellpadding,用其設(shè)定內(nèi)間距。
其中width表示表格的寬度,并且外間距一般都會(huì)設(shè)定為0,不然都不像是個(gè)表格的樣子。
①caption標(biāo)簽
標(biāo)題的意思,用以說明表格的標(biāo)題,我這邊還用了一個(gè)b標(biāo)簽將其給加粗了。
②th標(biāo)簽
table head的簡寫,也就是表格的表頭,它是默認(rèn)居中加粗的。
當(dāng)然我們也可以根據(jù)align屬性來設(shè)定排序位置(居左,居中,居右)。
此外,其中也可以使用thead、tbody、tfoot標(biāo)簽來劃分表格。
這個(gè)稍作了解即可,感覺使用這些標(biāo)簽和不使用這些標(biāo)簽對(duì)表格本身沒有影響。
2表格快速模板設(shè)置
看到左上角那個(gè)黃燈后點(diǎn)擊,選擇Language Injection Settings,最后選擇html即可。
這樣設(shè)置后就可以使用表格快速創(chuàng)建模板了。
先輸入table>tr*4>td*4,再加上Tab鍵,即可快速創(chuàng)建一個(gè)4*4的表格。
3合并單元格
①rowspan
合并行的意思,相同的列不同的行。
“2”的意思就是表示是跨兩行,從第1行開始將第1行和第2行合并起來了。
既然如此,那么第2行總共也就只需要3列了,所以將其第2行第1列刪除。
②colspan
合并列的意思,相同的行不同的列。
“3”的意思就是表示是跨3列,從第2列開始將第2列第3列和第4列合并起來了。
既然如此,那么第3行總共也就只需要2列了,所以將第3行中第3列第4列刪除。
謝謝你的觀看。
如果可以的話,麻煩幫忙點(diǎn)個(gè)贊,謝謝你。
果想開發(fā)一個(gè)網(wǎng)站,除了要精通后端開發(fā)語言(如:php)外,還要精通HTML代碼。那么,什么是HTML呢?HTML是一種超文本標(biāo)記語言,它包含有眾多的標(biāo)簽,我們可以通過這些標(biāo)簽,把不同的internet資源(如:文字、圖片、視頻、音頻、表單等等)整合在一個(gè)統(tǒng)一的文檔中,這就形成了我們可以看得見的網(wǎng)頁。那么,HTML都有哪些常用的標(biāo)簽?zāi)兀?/p>
html5文檔類型聲明:<!doctype html>
html4文檔類型聲明:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
這個(gè)標(biāo)簽是html最外層的標(biāo)簽,所有其它的HTML標(biāo)簽都要放在這個(gè)標(biāo)簽的內(nèi)部。
<html>
<head></head>
<body></body>
</html>
在HTML標(biāo)簽中,有的標(biāo)簽是成雙成對(duì)的,如:<html></html>(如下圖);而有的標(biāo)簽是單個(gè)的,如:<hr>橫線標(biāo)簽。
head頭部有以下幾種常用標(biāo)簽:
meta:主要提供有關(guān)頁面的元信息。
link:用來定義文檔與外部資源的關(guān)系,最常用的是調(diào)用CSS樣式文件。
title:頁面標(biāo)題的標(biāo)簽。
script:用來調(diào)用JS文件或JS代碼。當(dāng)然,script標(biāo)簽也可以在body主體中使用。
1、塊級(jí)標(biāo)簽。
塊級(jí)標(biāo)簽的特性是:獨(dú)自占有一行;標(biāo)簽的高與寬、邊距可以修改;沒有設(shè)置寬與高時(shí),默認(rèn)繼承父標(biāo)簽。例如:
<div>div1</div>
<div>div2</div>
<style>
.aa1{ border:1px solid #000; width:150px; height:100px; margin:30px; }
.aa2{ border:1px solid #000; width:150px; height:100px; margin:30px; }
</style>
前端頁面顯示的效果如下圖:
常用的塊級(jí)標(biāo)簽有:div、h1、h2、h3、h4、h5、h6、hr、menu、ul、ol、li、dl、dt、dd、table、p、form 。
2、內(nèi)聯(lián)標(biāo)簽。
內(nèi)聯(lián)標(biāo)簽與塊級(jí)標(biāo)簽不同,它不能獨(dú)自占有一行,會(huì)與其它內(nèi)聯(lián)標(biāo)簽在同一樣展示;內(nèi)聯(lián)標(biāo)簽的高與寬、上下邊距是不能修改的,它里面的文字或圖片有多高,它就是多高。例如如下代碼:
<style>
.aa1{ border:1px solid #000; width:150px; height:100px; margin:30px; }
.aa2{ border:1px solid #000; width:150px; height:100px; margin:30px; }
</style>
<span>span1</span>
<span>span2</span>
CSS樣式代碼跟塊級(jí)標(biāo)簽的例子是一樣的,而顯示的效果就不一樣了,寬與高、上下邊距沒有效果。如下圖:
常用的內(nèi)聯(lián)標(biāo)簽有:span、a、b、strong、i、em 。
3、內(nèi)聯(lián)塊級(jí)標(biāo)簽。
內(nèi)聯(lián)塊級(jí)標(biāo)簽,既有一些內(nèi)聯(lián)標(biāo)簽的特性,也有一些塊級(jí)標(biāo)簽的特點(diǎn):它不能獨(dú)自占有一行,但是可以修改它的寬度和高度。例如下面這段代碼:
<style>
.aa1{ border:1px solid #000; width:150px; height:100px; margin:30px; }
.aa2{ border:1px solid #000; width:150px; height:100px; margin:30px; }
</style>
<img src="w5.jpg" alt="">
<img src="w5.jpg" alt="">
CSS樣式代碼跟塊級(jí)標(biāo)簽的那個(gè)例子仍然是一樣的,圖片的寬和高、上下邊距修改成功,而2個(gè)圖片不能獨(dú)自占有一行,而是在同一行。如下圖:
常用的內(nèi)聯(lián)塊級(jí)標(biāo)簽有:img、input、textarea。
4、區(qū)域標(biāo)簽。
所謂區(qū)域標(biāo)簽,就是主要用來劃分布局頁面區(qū)域的。如:頭部、主體內(nèi)容、側(cè)邊欄、底部。這樣劃分的好處是:讓頁面布局更加清晰明了。
常用的區(qū)域標(biāo)簽有:header(頭部)、footer(底部)、nav(導(dǎo)航)、aside(側(cè)邊欄)、section(主體)、article(獨(dú)立內(nèi)容)。
5、表單標(biāo)簽。
這個(gè)表單標(biāo)簽我們也是會(huì)經(jīng)常用到的,如:登錄網(wǎng)站的時(shí)候、提交數(shù)據(jù)的時(shí)候。如下圖的評(píng)論表單:
?表單常用的標(biāo)簽有:form、input、select、option、textarea 。
以上就是我們開發(fā)網(wǎng)頁時(shí),會(huì)常用到的HTML標(biāo)簽。當(dāng)然,HTML標(biāo)簽遠(yuǎn)不止這些,尤其是html5出來后,新增了許多的新標(biāo)簽。但是,有些標(biāo)簽在我們開發(fā)中很少用到,所以,這里就沒有做相應(yīng)的介紹。
*請(qǐng)認(rèn)真填寫需求信息,我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。