整合營銷服務(wù)商
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
.<h1></h1>:標(biāo)題
2.<strong></strong>:加粗
<em></em>:斜線
<ins></ins>:下劃線
<del></del>:刪除線
3.<div></div>:一個(gè)占一行的格子
<span></span>：一個(gè)占一格的格子
4.<p></p>:一個(gè)段落
</br>:單標(biāo)簽 換行
5.<img src=”圖像的路徑和文件名”/>:圖像標(biāo)簽 注意：圖片要和vscode放在一個(gè)文件夾
alt:替換文本 圖像顯示不出來的時(shí)候用文字替換 (顯示不出來就是地址填錯(cuò)啥的)
使用方法：<img src=”圖像的路徑和文件名” alt=“這是一個(gè)魔方的圖片” />
Title：提示文本 鼠標(biāo)放到圖像上提示的文字
使用方法：<img src=”圖像的路徑和文件名” alt=“這是一個(gè)魔方的圖片” title=” 這是一個(gè)魔方的圖片“ />
6.<width>:設(shè)定圖像寬度
<height>:設(shè)定圖像高度
<border>:給圖像設(shè)定邊框
/:下一級
../:上一級
7.<a></a>:鏈接標(biāo)簽
<a href=”外部鏈接or內(nèi)部鏈接” target=”打開窗口的方式1._self 當(dāng)前窗口打開頁面 2._blank 新窗口打開頁面”/> 默認(rèn)是_self
<a href=”#”></a>:空鏈接
<a href=”壓縮包的名稱”></a>:下載鏈接
<a herf=”外部鏈接”><img src=”圖片地址名稱”></a>:點(diǎn)擊圖片到外部鏈接
錨點(diǎn)鏈接：點(diǎn)擊鏈接快速到達(dá)頁面的某個(gè)位置
8.注釋<!—“”--> 快捷鍵：ctrl+/
9.特殊字符： :空格
<：小于號(hào)<
>: 大于號(hào)>
8.<th></th>:表頭單元格 內(nèi)部字會(huì)居中并且加粗
<tr></tr>:行
<td></td>:列
Cellpadding=””：文字與單元格之間的間隙
Rowspan:跨行合并單元格
Colspan:跨列合并單元格
Align=“center left right”:讓表格所在頁面的位置
Border：邊框
Cellspacing:單元格與邊框之間的距離
<thead>：表格頭部區(qū)域標(biāo)簽
<tbody>：表格主題區(qū)域標(biāo)簽
Bgcolor：表格背景顏色
<input type=”text”>：一個(gè)框
<intput type=”checkbox”>:勾選正方形框
<input type=”radio”>:勾選圓圈框
若有不足，請大佬出手指點(diǎn)。
eb前端開發(fā)課程：html語法文本格式化標(biāo)簽。
講課人：波波老師。
講完段落，接下來看文本格式化標(biāo)簽，像word中一樣，在文本中也可以為文字設(shè)置粗體、斜體、下劃線等效果。為此，html準(zhǔn)備了專門的文本格式化標(biāo)簽，使文本以特殊的方式顯示。常見的文本格式化標(biāo)簽有這些。
然后是看斜體，然后是刪除線、下劃線、上標(biāo)、下標(biāo)文本、不要代碼片段。然后看還有small、小字體。
HTML5 將成為 HTML、XHTML 以及 HTML DOM 的新標(biāo)準(zhǔn)。HTML5 仍處于完善之中。然而，大部分現(xiàn)代瀏覽器已經(jīng)具備了某些 HTML5 支持。那什么又是HTML呢？HTML 是用來描述網(wǎng)頁的一種語言。HTML的上一個(gè)版本誕生于1999年。自從那以后，Web 世界已經(jīng)經(jīng)歷了巨變。HTML 指的是超文本標(biāo)記語言： Hyper Text Markup Language。HTML 不是一種編程語言，而是一種標(biāo)記語言。而標(biāo)記語言是一套標(biāo)記標(biāo)簽 (markup tag)。HTML 使用標(biāo)記標(biāo)簽來描述網(wǎng)頁，HTML 文檔包含了HTML 標(biāo)簽及文本內(nèi)容，因此HTML文檔也叫做 web 頁面。
HTML5 是 W3C 與 WHATWG 合作的結(jié)果。W3C 致 的是World Wide Web Consortium，也就是萬維網(wǎng)聯(lián)盟。而WHATWG 致 Web Hypertext Application Technology Working Group。WHATWG 致力于 web 表單和應(yīng)用程序，而 W3C 專注于 XHTML 2.0。在 2006 年的時(shí)候，雙方?jīng)Q定進(jìn)行合作，來創(chuàng)建一個(gè)新版本的 HTML。
新特性基于 HTML、CSS、DOM 以及 JavaScript；減少對外部插件的需求（比如 Flash）；更優(yōu)秀的錯(cuò)誤處理；更多取代腳本的標(biāo)記；HTML5 應(yīng)該獨(dú)立于設(shè)備；開發(fā)進(jìn)程應(yīng)對公眾透明。
用于繪畫的 canvas 元素；用于媒介回放的 video 和 audio 元素；對本地離線存儲(chǔ)得更好地支持；新的特殊內(nèi)容元素，比如 article、footer、header、nav、section新的表單控件，比如 calendar、date、time、email、url、search。
專業(yè)的 HTML 編輯器來編輯 HTML：Adobe Dreamweaver、Microsoft Expression Web、CoffeeCup HTML Editor、Sublime Text 。不過，我們同時(shí)推薦使用文本編輯器來學(xué)習(xí) HTML，比如 Notepad (PC) 或 TextEdit (Mac)。我們相信，使用一款簡單的文本編輯器是學(xué)習(xí) HTML 的好方法，高手們都是用記事本寫的~~~~
而本人使用的是Adobe Dreamweaver（下文中提到簡稱DW），大家可以自己嘗試各種編輯器，再選擇自己喜歡的。本教程是實(shí)用性類，不會(huì)長篇大論闡述理論，會(huì)留一些問題供大家去理解，不了解的話百度谷歌。
還需要的軟件就是瀏覽器的準(zhǔn)備，大家肯定知道什么是瀏覽器啦，現(xiàn)在谷歌，微軟新版瀏覽器以及360等眾多瀏覽器都是支持查看網(wǎng)頁源代碼的。鼠標(biāo)右鍵選擇查看源代碼即可。
學(xué)習(xí)資料推薦：
在本文中，需要理解的點(diǎn)，在下面講解中可能會(huì)混著講，所以大家要看完教程之后自己去總結(jié)。
首先打開DW，新建一個(gè)HTML文件，就是后綴是html結(jié)尾的文件。
用DW這樣的HTML專業(yè)軟件有個(gè)好處就是新建的文件已經(jīng)自動(dòng)寫好的一個(gè)HTML文件的基本結(jié)構(gòu)。文檔標(biāo)題在頁面中間上部的標(biāo)題處可以修改，也可以保存后自己再修改。
保存名字為教程1，可以看到文件是這樣的。
之后，我們嘗試用記事本打開這個(gè)文件。
用記事本打開的樣子。跟DW打開是一樣。
在body部分輸入文字，內(nèi)容隨意，然后保存。
再用瀏覽器打開，我這邊用的谷歌瀏覽器。打開之后可以看到如下圖所示。相信大家對HTML文件已經(jīng)有了一點(diǎn)點(diǎn)概念了。
再回到DW打開，可以看到，文件下邊是代碼，上邊是結(jié)果。如果只看到代碼，這是因?yàn)樵陧撁孀笊辖莻饕晥D的方式選擇。選擇拆分即可。
在DW中新建一個(gè)文件之后，你其實(shí)就已經(jīng)看到一個(gè)HTML的基本結(jié)構(gòu)了，這是我們剛才新建的教程1
紅色的矩形框內(nèi)部的內(nèi)容，我們稱為<!DOCTYPE> 聲明
<!DOCTYPE>聲明有助于瀏覽器中正確顯示網(wǎng)頁。網(wǎng)絡(luò)上有很多不同的文件，如果能夠正確聲明HTML的版本，瀏覽器就能正確顯示網(wǎng)頁內(nèi)容。
doctype 聲明是不區(qū)分大小寫的，以下方式均可：
<!DOCTYPE html>
<!DOCTYPE HTML>
<!doctype html>
<!Doctype Html>
通用聲明
HTML5
<!DOCTYPE html>
HTML 4.01
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
XHTML 1.0
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
查看完整網(wǎng)頁聲明類型 DOCTYPE 參考手冊。
<!DOCTYPE> 聲明之后就是 <html> .....</html> 中間的那些我們暫時(shí)忽略。這兩個(gè)尖括號(hào)之間的內(nèi)容就告訴了瀏覽器，這段內(nèi)容是html頁面的內(nèi)容。
在html頁面中，哪些是被顯示的，哪些是代碼？相信通過第一節(jié)大家已經(jīng)有所認(rèn)識(shí)了，在HTML中，標(biāo)簽是通過"< >"表現(xiàn)的。而每一個(gè)標(biāo)簽都以對應(yīng)的“</ >”來結(jié)束，如<html></html>,<head></head>,<title></title>.....。(當(dāng)然也有例外，之后再說)
接下來就是在 <html> ，</html>之間編輯整個(gè)頁面的頭部和身體了.
頭部用<head></head>來表示，之間的內(nèi)容一般包含meta 和title，meta大家可以自己去了解，如果沒有這一塊，顯示可能會(huì)出現(xiàn)亂碼。一些預(yù)先的設(shè)置都會(huì)放在頭部里，樣式表等，就像是C語言程序中的頭文件。title標(biāo)簽就是整個(gè)網(wǎng)頁的標(biāo)題。
編輯好了頭部，就進(jìn)入頁面的身體啦。用body標(biāo)簽來表示很直觀，也不需要刻意去記了。在實(shí)例1中body的內(nèi)容很簡單，只有一行文字，之后的內(nèi)容也就是教大家如何將body豐富起來~~
1.HTML 標(biāo)題<h1>-<h6>
2.HTML 段落<p>
3.HTML <br/>
在 HTML 文檔中，標(biāo)題很重要。
標(biāo)題是通過 <h1> - <h6> 標(biāo)簽進(jìn)行定義的.
<h1> 定義最大的標(biāo)題。 <h6> 定義最小的標(biāo)題。
看看實(shí)例效果
關(guān)于查看文件的效果，大家可以保持瀏覽器打開，當(dāng)DW中保存過文件以后，在瀏覽器中刷新一下，就可以看到效果。
HTML 可以將文檔分割為若干段落。段落是通過 <p> 標(biāo)簽定義的。在<p> </p>中輸入如下內(nèi)容，并在瀏覽器打開看一下效果。
如果我縮小瀏覽器的寬度，效果如下。
現(xiàn)在大家可以發(fā)現(xiàn)，html語言是一種排版語言，他會(huì)保證你可以看到內(nèi)容的全部，隨著瀏覽器的變化，文字排版也會(huì)跟著變化。你自己敲的空行，是不會(huì)顯示出來。那么如何自己定義斷行呢？介紹一個(gè)新的標(biāo)簽<br/>
英文brake的縮寫，很顯然，就是打斷的意思。因?yàn)檫@個(gè)標(biāo)簽是放在內(nèi)容的結(jié)尾的，所以它的開始就是結(jié)束，因此他沒有結(jié)束標(biāo)簽，所以沒有</br>,只有<br/>,大家要記清楚~
這時(shí)就能看到斷行啦。
<hr> 標(biāo)簽在 HTML 頁面中創(chuàng)建水平線。<hr>標(biāo)簽與<br>標(biāo)簽一樣，沒有結(jié)束標(biāo)簽。所以也可以寫成<hr/>.
在設(shè)置完水平線之后，我們還可以及設(shè)置水平線的寬度。
代碼<hr width=50%> 這里的50%是指頁面的50%，也可以設(shè)置一個(gè)具體的數(shù)值,比如50，是指50個(gè)像素，大家可自行嘗試。
這里的width就是這個(gè)標(biāo)簽的屬性。像這樣的屬性值，還有，align，size。但不同的效果，大家可以試試。這些效果學(xué)了CSS之后，都建議通過CSS樣式表來實(shí)現(xiàn)。
<hr width=50>設(shè)定絕對長度；
<hr align=left>設(shè)置左對齊，當(dāng)然也可以設(shè)置右對齊。
<hr size=1>這表示線寬；
曾有有一段時(shí)間屬性值“=”后面是需要加引號(hào)的，<hr width=“50”>，但現(xiàn)在所有瀏覽器都支持不加引號(hào)，大家看到有引號(hào)不要覺得是錯(cuò)誤的。
<標(biāo)簽名 屬性名=color> - 指定顏色
比如我可以給水平線設(shè)置顏色
在DW中輸入color=“之后會(huì)彈出顏色選擇，可以只選擇顏色，DW會(huì)自動(dòng)生成顏色代碼。
代碼為：
<h3>第四節(jié) 水平線</h3>
<hr width=90% color=”#FF0000“>
插入一條水平線
效果如下：
我們會(huì)舉例說一些，但是在學(xué)習(xí)CSS之后，字體樣式等于格式有關(guān)的功能，都會(huì)通過CSS樣式表來實(shí)現(xiàn)。所以，這里大家只要稍微了解下就好。
舉幾個(gè)例子
加粗<b></b>；斜體<i></i>；下劃線<ins></ins>；變小<small></small>；在html中，標(biāo)簽是可以嵌套的。大家可以仔細(xì)對比，以下代碼，和效果。
以下標(biāo)簽的顯示結(jié)果是由瀏覽器和樣式表決定的，這些標(biāo)簽標(biāo)識(shí)的意思而不是效果。這句話可能有一些難以理解，大家學(xué)習(xí)久了就會(huì)有所體會(huì)。
<em>強(qiáng)調(diào)</em>；<strong>著重</strong>；<dfn>definition</dfn>；<code>表示這一行是源代碼，僅用于小部分代碼。</code>；<samp>例子代碼</samp>；<kbd>用戶輸入</kbd>；<bar>變量</bar>；<site>引用</site>
我們試著輸入這些代碼。
掌握幾個(gè)標(biāo)簽<ul><li><ol><dl><dt><dd>，標(biāo)簽是可以嵌套的，大家自己可以試一試。
無序列表 <ul>和<li>標(biāo)簽
<ul>un-odered list <li>list item,一項(xiàng)
將 <ul> 標(biāo)簽與 <li> 標(biāo)簽一起使用，創(chuàng)建無序列表。將<ol>標(biāo)簽與<li>標(biāo)簽一起使用，創(chuàng)建有序列表。
代碼：
ol和ul可以嵌套自動(dòng)縮進(jìn)ul縮進(jìn)每層標(biāo)記不一樣會(huì)有實(shí)心和空心等不同的標(biāo)記。
<dl>、<dd>和<dt>標(biāo)簽
定義：<dl> 標(biāo)簽定義了定義列表（definition list）。<dd> 在定義列表中定義條目的定義部分。<dt> 標(biāo)簽定義了定義列表中的項(xiàng)目（即術(shù)語部分）。
用法：<dl> 標(biāo)簽用于結(jié)合 <dt> （定義列表中的項(xiàng)目）和 <dd> （描述列表中的項(xiàng)目）。
舉例代碼：
<dl>
<dt>計(jì)算機(jī)</dt>
<dd>用來計(jì)算的儀器 ... ...</dd>
<dt>顯示器</dt>
<dd>以視覺方式顯示信息的裝置 ... ...</dd>
</dl>
瀏覽器中的效果如下：
<table width="80%" border="1"> <tr> <th>www.dreamdu.com</th> <th>.com域名的數(shù)量</th> <th>.cn域名的數(shù)量</th> <th>.net域名的數(shù)量</th> </tr> <tr> <td>2003年</td> <td>1000</td> <td>2000</td> <td>3000</td> </tr> <tr> <td>2004年</td> <td>4000</td> <td>5000</td> <td>6000</td> </tr> <tr> <td>2005年</td> <td>7000</td> <td>8000</td> <td>9000</td> </tr> </table>
由于篇幅有限，今天的內(nèi)容就介紹這么多。如果你有什么想法或者建議，歡迎評論交流！
*請認(rèn)真填寫需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。
