時間:2023-07-22 17:24:02 | 來源:網(wǎng)站運營
時間:2023-07-22 17:24:02 來源:網(wǎng)站運營
Web開發(fā)-阿里云-HTML+CSS-HTML入門與實戰(zhàn):歡迎回來,我是饕餮,或者叫我offer,當然也可以叫我的英文名字-gluttony!前端的學習來說,前期的學習還是比較簡單的,所以要加油啦~!
IE
內(nèi)核) 國內(nèi)很多的雙核瀏覽器的其中一核便是 Trident
,美其名曰"兼容模式"。 雙核之一; Gecko
(Firefox 內(nèi)核): MoillaFireFox
(火狐瀏覽器)采用該內(nèi)核,Gecko
的特點是代碼完全公開(開源大法),因此,其可開發(fā)程度很高,全世界的程序員都可以為其編寫代碼,增加功能。 Safari
是蘋果公司開發(fā)的瀏覽器,所用瀏覽器內(nèi)核 WebKit
。雖然 chrome 內(nèi)核已經(jīng)是 blink
代表瀏覽器︰傲游瀏覽器3、Apple Safari (Win/Mac/iPhone/iPad)、Symbian 手機瀏覽器、Android 默認瀏覽器大部分國產(chǎn)瀏覽器最新版都采用 Blink 內(nèi)核。
目前移動設(shè)備瀏覽器上常用的內(nèi)核有 Webkit,Blink,Trident , Gecko 等,其中iPhone 和 iPad 等蘋果 ioS 平臺主要是 WebKit,Android 4.4 之前的 Android 系統(tǒng)瀏覽器內(nèi)核是 WebKit,Android4.4 系統(tǒng)瀏覽器切換到了 Chromium,內(nèi)核是Webkit 的分支 Blink,Windows Phone 8 系統(tǒng)瀏覽器內(nèi)核是 Trident。2.1.3 web 標準
傳智播客四個字被加粗,是因為有<>兼括號的存在,而<>就屬于一個標簽,簡而言之,HTML就是用文本來表示帶有特殊標簽的一種,而 strong 標簽正是加粗。2.2.3 HTML 骨架格式
<html>
開始,</html>
結(jié)束,將<title>
和</title>
放在<head>
和</head>
中間,<body>
和</body>
放在</head>
之后。 </br>
。 HTML 標簽:作用所有 html 中標簽的一個根節(jié)點;<html>
、<head>
、<body>
都是HTML標簽。所謂標簽就是放在"<>"標簽符中表示某個功能的編碼命令,也稱為HTML標簽或HTML元素。
<body>
我是內(nèi)容</body>
,<body>
是標簽開始部分,</body>
為標簽結(jié)束部分</br>
,單標簽數(shù)量較少。標簽關(guān)系分為兩種,嵌套和并列;
<head></head><body></body>
<strong><div></div></strong>
<head><title></head></title>
正確格式:<head><title></title></head>
<body><div></div></body>
統(tǒng)一口徑:如果兩個標簽之間的關(guān)系是嵌套關(guān)系,子元素最好縮進一個tab鍵的身位。如果是并列關(guān)系,最好上下對齊。養(yǎng)成嚴格的縮進是一個良好的習慣!例如:
Sublime的最大優(yōu)勢為:快速開發(fā)
<!DOCTYPE html>
的作用:表示我們使用的是何html版本?!猦tml:5的版本<!DOCTYPE>
標簽位于文檔的最前面,用于向瀏覽器說明當前文檔使用哪種HTML或XHTML標準規(guī)范,必需在開頭使用<!DOCTYPE >
標簽為所有的XHTML文檔指定XHTML版本和類型,只有這樣瀏覽器才能按指定的文檔類型進行解析。注意:一些老網(wǎng)可能用的還是老版本的文檔類型比如XHTML之類的,但是HTMLS的文檔類型兼容性很好。2.2.10 字符集簡介
<meta charset=“UTF-8”>
的作用:charset表示字符集,UTF-8是目前最常用的字符集編碼方式,常用的字符集編碼方式還有g(shù)bk和gb2312。GB2312,簡單中文,包括6763個漢字,BLG5,繁體中文,港澳臺等用,GBK包括全部中文字符,是GB2312的擴展,加入對繁體字的支持,兼容GB2312;UTF-8則包括全世界所有國家需要用到的字符使用UTF-8字符集,可以避免出現(xiàn)字符集不統(tǒng)一而引起亂碼的情況。這是一個良好的習慣。2.2.11 標簽語義化和標題標簽
語義化是否良好,去掉CSS之后,網(wǎng)頁結(jié)構(gòu)依然組織有序,具備良好的可讀性;
html 和 CSS 完全不同;排版標簽主要和 CSS 搭配,顯示網(wǎng)頁結(jié)構(gòu)的標簽,網(wǎng)頁布局最常用的標簽; 標題標簽: 單詞縮寫:head 頭部、標題 為了網(wǎng)頁的語義化,經(jīng)常使用到標題標簽, HTML 提供了六個等級的標題,即:
<h1>
,<h2>
,<h3>
,<h4>
,<h5>
和<h6>
。 標題標簽語義:作為標題使用,根據(jù)重要性遞減; 格式:<h2>
二級標題</h2>
<h7>
顯示原來的等級,所以最小等級標題為<h6>
;<p>
文本內(nèi)容</p>
<p>
是 HTML 文檔中最常用的標簽,默認情況下,文本在一個段落中會根據(jù)瀏覽器窗口大小自動換行。 <html lang="en"> <head> <meta charset="utf-8"></ head> <body> <h1>40.6攝氏度:杭州創(chuàng)出140年氣象史上高溫新紀錄</h1> <p>2016年7月27日10:58:26 來源:新華網(wǎng)</p> <hr /> <p>新華網(wǎng)杭州7月26日電(記者李榮)26日13時36分至47分這一時間段,杭州徐家匯氣象觀測站測得當日最高溫達40.6攝氏度。這是杭州有氣象記錄以來140年的高溫新紀錄,打破了此前19 3 4年創(chuàng)下的40.2攝氏度的歷史極值。</p> <p>杭州已經(jīng)連續(xù)2天發(fā)出了最高等級的紅色高溫警報。杭州中心氣象臺首席服務(wù)官滿莉萍說,今年副熱帶高壓強度特別強,對杭州及江南地區(qū)的控制“實在太穩(wěn)定了”,整個7月份基本上都處在它的勢力范圍之內(nèi)。25日杭州已出現(xiàn)了氣象史上7月份“第四高”的高溫值,這使得26日的“基礎(chǔ)”氣溫就很高,超過了30攝氏度,然后不斷地升溫。此外,26日白天風小,又吹的是西南風,特別是在中午之后這一個最易出現(xiàn)高溫的時段,光照又比較強,所以氣溫“直線飆升,一舉沖破歷史極值,出現(xiàn)了“創(chuàng)紀錄”的極端酷暑天。</p> <p>在杭州歷史上,出現(xiàn)40攝氏度以上極端高溫的幾率并不大。根據(jù)相關(guān)資料,中心城區(qū)徐家匯觀測站140年來僅出現(xiàn)了5次記錄,除了這一次的新紀錄,還有就是1934年7月12日的4 0﹒2攝氏度;</p> <p>1934年8月25日、2009年7月20日、2010年8月13日的40攝氏度。由于氣溫實在太高,杭州26日下午不少地區(qū)出現(xiàn)了熱對流天氣。氣象臺說,首先是浦東地區(qū),下起了熱雷雨。到15時05分,全市大部分地區(qū)出現(xiàn)了分散性的雷電活動和熱雷雨,中心城區(qū)徐家匯等地都響起了隆隆的雷聲。</p></body> </html>
2.3.3 換行和div span標簽這時如果還像在word中直接敲回車鍵換行就不起作用了。其中
<br />
就是換行標簽的符號,具體操作如下:<! DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> < / head> <body> <h3>------------中國四大美女---------<h3> 1, 貂蟬<br /> 2, 王昭君<br /> 3, 楊玉環(huán)<br /> 4, 鳳姐思密達<br />< / body> < / html>
<div>頭部</div>
<span>今日價格</span>
<! DOCTYPE html> <html lang="en"><head> <meta charset="utf-8"> < / head> <body> <h3>------------中國四大美女---------<h3> 5, 貂蟬<br /> 6, 王昭君<br /> 7, 楊玉環(huán)<br /> 8, 鳳姐思密達<br /> Div 標簽的使用 <div>我是劉德華</div> Span 標簽的使用 <span>我是劉曉慶</span>< / body> < / html>
2.3.4 文本格式標簽<b>
<i>
<s>
<u>
這一組標簽一般不推薦使用,其效果只是起到相應(yīng)的作用,而后面一組除了起到該有的效果之外,還起到強調(diào)的作用。 例如:< ! DOCTYPE html><html lang="en"> <head> <meta charset="utf-8"> </head> <body> <h3>-------文本格式化標簽-------</h3> <b>清蒸班主任</b>,<br /> <strong>油炸小助教.</strong> <br /> <i>糖醋伴導(dǎo)師,</i> <br /> <em>班長要紅燒。</em><br /> <hr /> 優(yōu)惠大促銷:原價:<s>1888</s><del>188</del> <br /> 現(xiàn)價:<u> 8.8</u><ins> 0.88</ins>r </ body> < / html>
2.3.5 標簽屬性< ! DOCTYPE html><html lang="en"><head><meta charset="utf-8"></ head><body>要求,水平線的長度(width)為500顏色為紅色<hr color="red" width="500"/>標簽屬性:1. 標簽可以擁有多個屬性,必須寫在開始標簽中,位于標簽名后面。2. 屬性之間不分先后順序,標簽名與屬性、屬性與屬性之間均以空格分開。3. 任何標簽的屬性都有默認值,省略該屬性則取默認值。< / body></ html>
一個標簽的屬性一定要寫在這個標簽里面去。2.3.6 圖像標簽
<!DOCTYPE html> <chtml lang="en"> <head> <meta charset="utf-8"></head> <body> br hr img 三個單標簽1.基本圖像插入方式cbr /> <img src="wo. jpg"/> (br /> 2.帶有alt的圖像<br /> <img src="wo1. jpg" alt= ”這是我的大頭貼"/> <br /> 3.帶有title的圖像<br /> <img src="wo. jpg" title="劉德華的圖像"/> <br /> </body> </html>
范例(帶有title的圖像):<img src =”wo.jpg “title=”劉德華的圖像”width=”_400_ ”/> <br/>
Border(設(shè)置圖像邊框):<img src =”wo.jpg “title=”劉德華的圖像”width=”_400_ ”/> <br/>
2.3.7 鏈接標簽<h3>友情鏈接</h3><a href=”[http://www.baidu.com](http://www.baidu.com/)”>百度</a><h3>友情鏈接:</h3><a href=”[http://www.sina.com](http://www.sina.com/)”>新浪</a>
注意: http://
www.baidu.com
<a href="index.html">首頁</a>
<a href = “#live”>3 個人生活</a><br />
個人生活正文: Herf=”#live” <h3 id=”live”>個人生活</h3> <hr />
假如想要找到xxx的“演藝經(jīng)歷”<a href = “#live”>3 演藝經(jīng)歷</a><br />
演藝經(jīng)歷正文:Herf=”#live”<h3 id=”live”>個人生活</h3><hr />
2.3.9 base 標簽 <a href = “http://www.baidu.com/” target=”_blank”>百度</a>
(現(xiàn)1)<base target=”_blank”/>
<a href = “http://www.baidu.com/” target=”_blank”>百度</a>
與<base target=”_blank”/>
同時存在,各行使各的職責。 ;
(幾個空格輸幾個)即可<p>段落</p>
<li>
,先寫四個有序列表會根據(jù)你寫的順序放在第一位可以改成羅馬數(shù)字;2.3.16 四大名著案例
<h1>
保存一下,再刷新<ul>
,跟<li>
連用。來自黑馬程序員的教程;2.3.17 自定義列表
<dl>
,之后按回車,編輯杭州,編輯<dd>
,下面<dd>
圍繞<dt>
;本文素材來源于網(wǎng)絡(luò),如有侵權(quán)請聯(lián)系作者予以刪除!
關(guān)鍵詞:入門,實戰(zhàn)
微信公眾號
版權(quán)所有? 億企邦 1997-2025 保留一切法律許可權(quán)利。