HTML---第一天筆記

WEB標準構成

web標準不是某個標準盛嘿,而是有W3C和其他標準組織制定的一系列標準集合荠割。主要包括:結構、表現(xiàn)和行為三個方面儡首。

結構標準:結構用于對網頁元素進行整理和分類,主要包括XML和HTML兩個部分偏友。

樣式標準:樣式用于設置網頁元素的版式蔬胯、顏色。大小等外觀樣式约谈,主要指的是CSS笔宿。

行為標準:行為是指網頁模型的定義以及交互的編寫,主要包括DOM和JS兩部分棱诱。

HTML骨架格式


html標簽:作用所有html中標簽的一個根節(jié)點泼橘。

head標簽:用于存放:title,meta,base,style迈勋,script炬灭,link等標簽,其中head標簽中必須要放置title標簽靡菇。

title標簽:讓頁面擁有一個屬于自己的標題重归。

body標簽:頁面的主題部分,用于存放所有的html標簽厦凤,主要用來構成頁面的結構鼻吮。

HTML標簽分類

HTML頁面中,帶有“<>”符號的元素被稱為HTML標簽较鼓,所謂的標簽就是帶有某種功能或者語義的編碼命令椎木,同時也稱為HTML標簽或者HTML元素。常見的HTML標簽的形式有兩種:雙標記標簽和單標記標簽博烂。

雙標記標簽:

結構:<標簽名>內容</標簽名>香椎,雙標記標簽有開始標簽也有結束標簽。

常見雙標記標簽有:<html></html>/<title></title>/<body></body>/<h1~6></h1~6>等

單標記標簽:

結構:<標簽名 />,單標記標簽也長稱為空標簽禽篱,是指用一個符號即可完整描述某個功能的標簽畜伐。

HTML標簽的關系:

1.嵌套關系(父子關系):

如html結構中<head><title></title></head>head與titl即為嵌套關系。

2.并列關系(.兄弟關系)

如HTML結構中的<head></head><body></body>head與body之間即為并列關系躺率。

注意:在書寫html代碼時如果兩哥標簽之間是并列關系則最好上下對齊玛界,若是嵌套關系,則盡可能的將子元素縮進一個tab鍵的身位悼吱。

常用的HTML標簽:

標題標簽<hn>標題文本</hn>(n從1到6):隨著n 的增大脚仔,標題的字號逐漸減小,并且所有的h 標簽的字體均默認加粗舆绎。

注意:h1一般都是用作文本標題或則給logo使用的鲤脏,在使用標題標簽時盡量不要使用h1標簽,一般情況下一個頁面中只允許使用一個h1標簽。

段落標簽<p>文本內容</p>:段落標簽可以將網頁中的文字有條理的顯示出來猎醇。默認情況下窥突,文本在一個段落中會根據瀏覽器窗口的大小自動切換行。

水平線標簽<hr />:水平線標簽是個單標記標簽硫嘶,可以使用水平線標簽將網頁中的文本段落隔開阻问。

換行標簽<br />:在html編輯過程中我們常用的空格合回車都不會再網頁中顯示效果,如果你想讓一段文字在固定的位置換行沦疾,只能添加<br />換行標簽称近,網頁才是顯示效果。

圖像標簽:<img src="插入圖片的路徑" alt="當圖片不能正常顯示時哮塞,圖片的文本描述" /> ,圖像標簽是單標記標簽刨秆。

文本格式化標簽:在網頁中,有時需要為文字設置粗體忆畅,斜體衡未,下劃線效果,這是就需要使用文本格式化標簽家凯,使文字顯示出特殊效果缓醋。

常見的文本格式化標簽有如下幾對:

1,文本以粗體的形式顯示:<b></b>绊诲、<strong></strong>,在xthml中推薦使用strong

2送粱、文本以斜體的方式顯示:<i></i>、<em></em>掂之,在XHTML中推薦使用em

3抗俄、文本以加有刪除線的方式顯示:<s></s>、<del></del>板惑,在XHTML中推薦使用del

4,文本以加有下劃線的方式顯示:<u></u>偎快、<ins></ins>

標簽屬性:

在使用html制作網頁時冯乘,如果想讓HTML標記提供更多的信息,可以使用HTML標記屬性加以設置晒夹。其基本語法格式為:

<標簽名 屬性1=“屬性值1” 屬性2=“屬性值2” ...>內容</標簽名>

標簽的屬性室友鍵值對構成的裆馒,一個標簽可以有多個屬性,不同的屬性之間用空格隔開丐怯。

鏈接標簽:用于在HTML頁面中創(chuàng)建超鏈接喷好,其基本語法格式如下:

<a href="跳轉目標" target="目標窗口的彈出方式">文本、圖像</a>

上述標簽中的屬性:

href:用于指定鏈接跳轉目標的URL地址读跷,當標記應用href時梗搅,則說明該標簽具有了超鏈接的功能。

traget:用于指定鏈接頁面的打開方式,其取值有_self:為默認值无切,表示在當前窗口中打開荡短,_blank在新建窗口中打開鏈接頁面。

錨點定位:通過創(chuàng)建錨點鏈接哆键,用戶能夠快速定位到目標內容掘托,創(chuàng)建錨點定位的步驟:

1.使用“<a href="#id名">鏈接文本</a>”創(chuàng)建鏈接文本

2.使用相應的id名標注跳轉目標的位置

HTML注釋:

注釋是為了讓編寫代碼的人員能夠清楚知道代碼的功能,HTML注釋標簽結構:

<!--注釋文本-->注釋文本在網頁中顯示不出來

路徑介紹:

1籍嘹、相對路徑:

(1)圖像文件和HTML文件位于同一個文件夾中:只需輸入圖像的文件名即可

(2)圖像文件位于HTML下一級文件夾:則引入文件時需要輸入文件夾名稱和文件名闪盔,文件夾名和文件名之間用/隔開

(3)圖像文件位于HTML文件的上一級文件:則引入文件時需要在文件名之前加上“../",如果是上兩級則需要加上兩個"../",依次類推

2辱士、絕對路徑:

即文件所在位置的完整地址泪掀。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市识补,隨后出現(xiàn)的幾起案子族淮,更是在濱河造成了極大的恐慌,老刑警劉巖凭涂,帶你破解...
    沈念sama閱讀 219,188評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件祝辣,死亡現(xiàn)場離奇詭異,居然都是意外死亡切油,警方通過查閱死者的電腦和手機蝙斜,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,464評論 3 395
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來澎胡,“玉大人孕荠,你說我怎么就攤上這事」ニ” “怎么了稚伍?”我有些...
    開封第一講書人閱讀 165,562評論 0 356
  • 文/不壞的土叔 我叫張陵,是天一觀的道長戚宦。 經常有香客問我个曙,道長,這世上最難降的妖魔是什么受楼? 我笑而不...
    開封第一講書人閱讀 58,893評論 1 295
  • 正文 為了忘掉前任垦搬,我火速辦了婚禮,結果婚禮上艳汽,老公的妹妹穿的比我還像新娘猴贰。我一直安慰自己,他們只是感情好河狐,可當我...
    茶點故事閱讀 67,917評論 6 392
  • 文/花漫 我一把揭開白布米绕。 她就那樣靜靜地躺著瑟捣,像睡著了一般。 火紅的嫁衣襯著肌膚如雪义郑。 梳的紋絲不亂的頭發(fā)上蝶柿,一...
    開封第一講書人閱讀 51,708評論 1 305
  • 那天,我揣著相機與錄音非驮,去河邊找鬼交汤。 笑死,一個胖子當著我的面吹牛劫笙,可吹牛的內容都是我干的芙扎。 我是一名探鬼主播,決...
    沈念sama閱讀 40,430評論 3 420
  • 文/蒼蘭香墨 我猛地睜開眼填大,長吁一口氣:“原來是場噩夢啊……” “哼戒洼!你這毒婦竟也來了?” 一聲冷哼從身側響起允华,我...
    開封第一講書人閱讀 39,342評論 0 276
  • 序言:老撾萬榮一對情侶失蹤圈浇,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后靴寂,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體磷蜀,經...
    沈念sama閱讀 45,801評論 1 317
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 37,976評論 3 337
  • 正文 我和宋清朗相戀三年百炬,在試婚紗的時候發(fā)現(xiàn)自己被綠了褐隆。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 40,115評論 1 351
  • 序言:一個原本活蹦亂跳的男人離奇死亡剖踊,死狀恐怖庶弃,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情德澈,我是刑警寧澤歇攻,帶...
    沈念sama閱讀 35,804評論 5 346
  • 正文 年R本政府宣布,位于F島的核電站梆造,受9級特大地震影響缴守,放射性物質發(fā)生泄漏。R本人自食惡果不足惜澳窑,卻給世界環(huán)境...
    茶點故事閱讀 41,458評論 3 331
  • 文/蒙蒙 一斧散、第九天 我趴在偏房一處隱蔽的房頂上張望供常。 院中可真熱鬧摊聋,春花似錦、人聲如沸栈暇。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,008評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至煎源,卻和暖如春色迂,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背手销。 一陣腳步聲響...
    開封第一講書人閱讀 33,135評論 1 272
  • 我被黑心中介騙來泰國打工歇僧, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人锋拖。 一個月前我還...
    沈念sama閱讀 48,365評論 3 373
  • 正文 我出身青樓诈悍,卻偏偏與公主長得像,于是被迫代替她去往敵國和親兽埃。 傳聞我的和親對象是個殘疾皇子侥钳,可洞房花燭夜當晚...
    茶點故事閱讀 45,055評論 2 355

推薦閱讀更多精彩內容

  • Spring Cloud為開發(fā)人員提供了快速構建分布式系統(tǒng)中一些常見模式的工具(例如配置管理,服務發(fā)現(xiàn)柄错,斷路器舷夺,智...
    卡卡羅2017閱讀 134,664評論 18 139
  • 0.B/S結構 瀏覽器服務器模式,web瀏覽器是客戶端最主要的應用軟件.將客戶端使用web進行統(tǒng)一,系統(tǒng)功能實現(xiàn)集...
    liusong007閱讀 1,058評論 0 1
  • HTML標簽解釋大全 一、HTML標記 標簽:!DOCTYPE 說明:指定了 HTML 文檔遵循的文檔類型定義(D...
    米塔塔閱讀 3,247評論 1 41
  • 原 Blog 鏈接:HTML基礎學習筆記 自學 html 基礎筆記 Web 前端簡單介紹 web 前端包含: pc...
    任凱閱讀 1,397評論 0 5
  • HTML基礎 本文包括 HTML基本知識與結構 HTML常見標簽 標簽寫法與嵌套的討論 HTML售貌、CSS给猾、java...
    廖少少閱讀 2,086評論 2 21