HTML01

第一次課主要講解了HTML是什么降狠,HTML結(jié)構(gòu)对竣,部分標(biāo)簽的講解,標(biāo)簽的劃分榜配,標(biāo)簽的部分分類否纬。
HTML是用來編寫網(wǎng)頁使用的語言,先學(xué)習(xí)了HTML4的知識點蛋褥。
HTML結(jié)構(gòu)說明临燃,首先是程序的開始<!DOCTYPE html> 是html5的標(biāo)識,html是最外層的標(biāo)簽烙心,然后是head膜廊,boby部分。注意標(biāo)簽都是成對出現(xiàn)淫茵。head部分包括(title(文檔名)爪瓜、meta(基本設(shè)置)、script(引入js)匙瘪、style(樣式設(shè)置)铆铆、link(外部引入css)。
<!DOCTYPE HTML>
<html>
<head>
<title>第一個正規(guī)的html</title>
<meta charset="UTF-8">
</head>
<body>
我我的
</boby>
</html>
標(biāo)題為&lth1&gt到&lth6&gt字體大小越來越小
一般來說h1一個頁面只能用一次
h3可以用兩到三次
h4 h5
seo搜索引擎優(yōu)化只針對h1-h3
<b>粗體</b>?文本
<i>斜體</i>?文本
<u>下劃線</u>
文本 <s>刪除線</s>
文本 下標(biāo)
文本 上標(biāo)
段落元素<p>
換行元素

分隔線元素



預(yù)格式化<pre>
第一次作業(yè)01:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>HTML教程</title>
</head>
<body>
<h1>HTML簡介</h1>
<input type="button" value="上一頁">
<input type="button" value="下一頁">


<h2>HTML教程</h2>
<p>在本教學(xué)中丹喻,你將學(xué)習(xí)如何使用HTML來創(chuàng)建站點薄货。</p>
<p>HTML很容易學(xué)習(xí)!你會喜歡它的碍论!</p>
<p>現(xiàn)在開始學(xué)習(xí)HTML!</p>


<h3>HTML實例<h3>
<p>學(xué)習(xí)100個實例菲驴!使用我們的編輯器,你可以編輯HTML骑冗,然后點擊測試按鈕來查看結(jié)果赊瞬。</p>
<p> <input type="button" value="親自試一試吧!"> </p>


<h4>HTML測驗<h4>
<p>w3School測試你的HTML技能贼涩!</p>
<p>HTML測驗!</p>


<h4>HTML參考手冊<h4>
<p>在w3school,我們提供完整的HTML參考手冊巧涧,其中包括標(biāo)簽、屬性遥倦、顏色谤绳、實體等等。</p>
<p>HTML4.01參考手冊


<input type="button" value="上一節(jié)">
<input type="button" value="下一節(jié)">
</boby>
</html>
第一次作業(yè)02:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>HTML簡介</title>
</head>
<body>
<p>HTML簡介</p>


<input type="button" value="上一節(jié)">
<input type="button" value="下一節(jié)">


<p>實例</p>
<pre style="border:1px gray dotted;">
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
<input type="button" value="親自試一試">


<p>什么是HTML?</p>
<p>HTML是用來描述網(wǎng)頁的一種語言袒哥。</p>
<ul>
<li>HTML指的是超文本標(biāo)記語言(Hyper Text Markup Language) </li>
<li>HTML不是一種編程語言缩筛,而是一種標(biāo)記語言(markup language)</li>
<li>標(biāo)記語言是一套標(biāo)記標(biāo)簽(markup tag)</li>
<li>HTML使用標(biāo)記標(biāo)簽來描述網(wǎng)頁</li>
</ul>


<p>HTML標(biāo)簽</p>
<p>HTML標(biāo)記標(biāo)簽通常被稱為HTML標(biāo)簽(HTML tag)</p>
<ul>
<li>HTML標(biāo)簽是由尖括號包圍的關(guān)鍵詞,比如<html></li>
<li>HTML標(biāo)簽通常是成對出現(xiàn)的堡称,比如<b>和</b></li>
<li>標(biāo)簽對中的第一個標(biāo)簽是開始標(biāo)簽瞎抛,第二個標(biāo)簽是結(jié)束標(biāo)簽</li>
<li>開始和結(jié)束標(biāo)簽頁被稱為開放標(biāo)簽和閉合標(biāo)簽</li>
</ul>


<p>HTML文檔=網(wǎng)頁</p>
<ul>
<li>HTML文檔描述網(wǎng)頁</li>
<li>HTML文檔包含HTML標(biāo)簽和純文本</li>
<li>HTML文檔也被稱為網(wǎng)頁</li>
</ul>
<p>web瀏覽器的作用就是讀取HTML文檔,并以網(wǎng)頁的形式顯示出它們却紧。瀏覽器不會顯示HTML標(biāo)簽桐臊,而是使用標(biāo)簽來解釋頁面的內(nèi)容:</p>
<pre style="border:1px gray dotted;">
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>
</pre>
<p>例子解釋</p>
<ul>
<li>&lthtml&gt與&lt/html&gt之間的文本描述網(wǎng)頁</li>
<li>&ltbody&gt與&lt/body&gt之間的文本是可見的頁面內(nèi)容</li>
<li>&lth1&gt與&lt/h1&gt之間的文本被顯示為標(biāo)題</li>
<li>&ltp&gt與&lt/p&gt之間的文本被顯示為段落</li>
</ul>


<input type="button" value="上一節(jié)"> <input type="button" value="下一節(jié)">
</body>
</html>
第一次作業(yè)03:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>基本的HTML標(biāo)簽-四個實例</title>



</head>
<body>
<p>基本的HTML標(biāo)簽-四個實例</p>
<input type="button" value="上一節(jié)">
<input type="button" value="下一節(jié)">


<p><b>本章通過實例向您演示最常用的HTML標(biāo)簽</p></b>
<p>提示:不要擔(dān)心本章中您還沒有學(xué)過的例子胎撤,您將在下面的章節(jié)中學(xué)到它們。</p>
<p>提示:學(xué)習(xí)HTML最好的方式就是邊學(xué)邊做實驗断凶。我們?yōu)槟鷾?zhǔn)備了很好的HTML編輯器伤提。您可以任意編輯一段HTML源碼,然后單擊TLY按鈕來查看結(jié)果认烁。</p>


<p><b>HTML標(biāo)題</p></b>
<p>HTML標(biāo)題(Heading)是通過&lth1&gt-&lth6&gt等標(biāo)簽進(jìn)行定義的肿男。</p>
<p><b>實例</p></b>
<pre style="border:1px gray dotted;">
&lth1&gt This is a heading &lt/h1&gt
&lth2&gt This is a heading &lt/h2&gt
&lth3&gt This is a heading &lt/h3&gt
</pre>
<input type="button" value="親自試一試">


<p><b>HTML段落</p></b>
<p>HTML段落是通過<p>標(biāo)簽進(jìn)行定義的。</p>
<p><b>實例</p></b>
<pre style="border:1px gray dotted;">
&ltp&gt This is a paragraph.&lt/p&gt
&ltp&gt This is a another paragraph.&lt/p&gt
</pre>
<input type="button" value="親自試一試">


<p><b>HTML鏈接</p></b>
<p>HTML鏈接是通過&lta&gt標(biāo)簽進(jìn)行定義的却嗡。</p>
<p><b>實例</p></b>
<pre style="border:1px gray dotted;">
&lt a href="http://www.w3school.com.cn"&gt This is a link&lt/a&gt
</pre>
<input type="button" value="親自試一試">
<p><b>注釋:</p></b> <p>在href屬性中指定鏈接的地址舶沛。</p>
<p>(您將在本教程稍后的章節(jié)中學(xué)習(xí)更多有關(guān)屬性的知識)。</p>


<p><b>HTML圖像</p></b>
<p>HTML圖像是通過&ltimg&gt標(biāo)簽進(jìn)行定義的稽穆。</p>
<p><b>實例</p></b>
<pre style="border:1px gray dotted;">
&ltimg src="w3school.jpg" width="104" height="142"/&gt
</pre>
<input type="button" value="親自試一試">
<p><b>注釋:</p></b><p>圖像的名稱和尺寸是以屬性的形式提供的冠王。</p>


<input type="button" value="上一節(jié)"> <input type="button" value="下一節(jié)">


第一次課聽完赶撰,感覺比較迷糊舌镶,有很多標(biāo)簽都記不太清,回宿舍以后馬上開電腦開始寫作業(yè)豪娜,感覺上課都聽懂了餐胀,但是自己回去寫的時候去發(fā)現(xiàn)有點無從下手的感覺。慢慢的寫完寫完第一個思路才稍稍清晰些瘤载。寫完第二個的時候應(yīng)該半夜兩點了否灾。突然有點感概,但既然決定走了鸣奔,那么付出多少將會得到多少墨技。看到代碼一個一個的敲出來挎狸,慢慢成型的頁面扣汪,哪怕很簡單但是很有成就感啊锨匆!老師很幽默也很耐心崭别,菜鳥練成記吧,或許現(xiàn)在菜鳥都不能算==

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末恐锣,一起剝皮案震驚了整個濱河市茅主,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌土榴,老刑警劉巖诀姚,帶你破解...
    沈念sama閱讀 211,194評論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異玷禽,居然都是意外死亡学搜,警方通過查閱死者的電腦和手機(jī)娃善,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,058評論 2 385
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來瑞佩,“玉大人聚磺,你說我怎么就攤上這事【嫱瑁” “怎么了瘫寝?”我有些...
    開封第一講書人閱讀 156,780評論 0 346
  • 文/不壞的土叔 我叫張陵,是天一觀的道長稠炬。 經(jīng)常有香客問我焕阿,道長,這世上最難降的妖魔是什么首启? 我笑而不...
    開封第一講書人閱讀 56,388評論 1 283
  • 正文 為了忘掉前任暮屡,我火速辦了婚禮,結(jié)果婚禮上毅桃,老公的妹妹穿的比我還像新娘褒纲。我一直安慰自己,他們只是感情好钥飞,可當(dāng)我...
    茶點故事閱讀 65,430評論 5 384
  • 文/花漫 我一把揭開白布莺掠。 她就那樣靜靜地躺著,像睡著了一般读宙。 火紅的嫁衣襯著肌膚如雪彻秆。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,764評論 1 290
  • 那天结闸,我揣著相機(jī)與錄音唇兑,去河邊找鬼。 笑死桦锄,一個胖子當(dāng)著我的面吹牛扎附,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播察纯,決...
    沈念sama閱讀 38,907評論 3 406
  • 文/蒼蘭香墨 我猛地睜開眼帕棉,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了饼记?” 一聲冷哼從身側(cè)響起香伴,我...
    開封第一講書人閱讀 37,679評論 0 266
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎具则,沒想到半個月后即纲,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 44,122評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡博肋,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,459評論 2 325
  • 正文 我和宋清朗相戀三年低斋,在試婚紗的時候發(fā)現(xiàn)自己被綠了蜂厅。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,605評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡膊畴,死狀恐怖掘猿,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情唇跨,我是刑警寧澤稠通,帶...
    沈念sama閱讀 34,270評論 4 329
  • 正文 年R本政府宣布,位于F島的核電站买猖,受9級特大地震影響改橘,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜玉控,卻給世界環(huán)境...
    茶點故事閱讀 39,867評論 3 312
  • 文/蒙蒙 一飞主、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧高诺,春花似錦碌识、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,734評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽耽梅。三九已至薛窥,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間眼姐,已是汗流浹背诅迷。 一陣腳步聲響...
    開封第一講書人閱讀 31,961評論 1 265
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留众旗,地道東北人罢杉。 一個月前我還...
    沈念sama閱讀 46,297評論 2 360
  • 正文 我出身青樓,卻偏偏與公主長得像贡歧,于是被迫代替她去往敵國和親滩租。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 43,472評論 2 348

推薦閱讀更多精彩內(nèi)容