你是怎么理解HTML語義化,HTML語義化標簽理解

1:語義化標簽是什么?

語義化標簽,目的是讓標簽有自己的含義

語義化

非語義化

如上代碼,p標簽含義就是段落,而span標簽毫無意義。

2:語義化標簽好處

方便用戶閱讀,頁面更加清晰。

更好的SEO,搜索引擎根據標簽來確定上下文和各個關鍵字的權重。

有利于開發維護。

3:頁面結構語義化標簽

1、

定義文檔或者文檔的部分區域的頁眉,應作為介紹內容或者導航鏈接欄的容器。

在一個文檔中,您可以定義多個元素,但需要注意的是元素不能作為

、 或 元素的子元素。

2、

描述一個含有多個超鏈接的區域,該區域包含跳轉到其他頁面或頁面內部其他部分的鏈接列表。

在一個文檔中,可定義多個元素。

3、

定義文檔的主要內容,該內容在文檔中應當是獨一無二的,不包含任何在文檔中重復的內容,比如側邊欄,導航欄鏈接,版權信息,網站logo,搜索框(除非搜索框作為文檔的主要功能)。

需要注意的是在一個文檔中不能出現多個標簽。

4、

元素表示文檔、頁面、應用或網站中的獨立結構,是可獨立分配的、可復用的結構,如在發布中,它可能是論壇帖子、雜志或新聞文章、博客、用戶提交的評論、交互式組件,或者其他獨立的內容項目。

當元素嵌套使用時,則該元素代表與外層元素有關的文章。例如,代表博客評論的元素可嵌套在代表博客文章的元素中。

5、

元素表示一個和其余頁面內容幾乎無關的部分,被認為是獨立于該內容的一部分且可以被單獨的拆分出來而不會影響整體。通常表現為側邊欄或嵌入內容。

6、

定義最近一個章節內容或者根節點元素的頁腳。一個頁腳通常包含該章節作者、版權數據或者與文檔相關的鏈接等信息。

使用footer插入聯系信息時,應在 footer 元素內使用

元素。

注意不能包含或者

7、

表示文檔中的一個區域(或節),比如,內容中的一個專題組。

4:常見語義化標簽

:頁面主題內容

:h1~h6分級標題,用于創建頁面信息的層級關系。

:呈現小號字體效果,指定細則,輸入免責聲明、注解、署名、版權。

:表示內容重要性

:標記內容著重點

:突出顯示文本(yellow),提醒讀者。

:創建圖

:figure的標題,必須是figure內嵌的第一個或者最后一個元素

:指明引用或參考,如圖書的標題,歌曲、電影、等的名稱,演唱會、音樂會、規范、報紙、或法律文件等。

:引述文本,默認新的一行顯示

:標記時間。datetime屬性遵循特定格式,如果忽略此屬性,文本內容必須是合法的日期或者時間格式。

:作者、相關人士或組織的聯系信息(電子郵件地址、指向聯系信息頁的鏈接)

:完成進度

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/532981.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/532981.shtml
英文地址,請注明出處:http://en.pswp.cn/news/532981.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

html5離開網頁自動暫停,通過html5代碼在網頁中實現播放和暫停音樂mp3,mav等文

介紹通過html5代碼在網頁中實現播放和暫停音樂mp3,mav等文件的具體操作方法。這樣對于用戶來說,在線可播放功能能大大提高站內效率也可帶來一定的流量。希望對有需要的朋友有所幫助。這里我們需要先了解下,在html5中的兩個個重要標簽。阿里西西web開發網…

android開發屏幕橫放,android-即使從橫向旋轉到垂直,細節片段也會...

在一個Activity中,我們稱其為MasterActivity,我只想在橫向模式下加載媒體播放的細節片段.準備就緒后,媒體將自動啟動.主從流程設置:我有兩個xml,activity_master和activity_master.xml(land).標識為“ detail_container”的容器視圖僅位于景觀xml中.具有細節容器的l…

android insmod命令,android的啟動腳本(init.rc)文件的語法

android的啟動腳本(init.rc)文件的語法,參考資料:Android 初始化語言(Android Init Language)Android初始化腳本語言包含四種類型的語句:動作(Actions)指令(Commands)服務(Services)選項(Options)該語言的語法包括下列約定:所有類…

android digest 認證,探究 Android 簽名機制和原理

背景最近在調研一個測試工具的使用,在使用中發現被測試工具處理過的apk文件經安裝后打開就會崩潰,分析崩潰日志后原因是簽名不一致導致的。說到Android中的簽名,可能大家都知道簽名的目的就是為了保護apk文件的安全,如果apk被惡意…

html圖片拼接出現留白,關于img標簽周圍留白的問題

在進行頁面的DIV CSS排版時,遇到IE6瀏覽器中的圖片元素img下出現多余空白的問題絕對是常見的,對于該問題的解決方法也是“見機行事”。1、將圖片轉換為塊級對象即,設置img為“display:block;”。在本例中添加一組CSS代碼:“#sub i…

html5中的行高元素,詳解HTML元素的height、offsetHeight、clientHeight、scrollTop等梳理

關于元素的一些屬性在前端的日常開發中,我們經常無可避免的需要獲取或者監聽一些頁面的屬性,那么我們需要經常了解一些屬性代表的含義才能更好地使用這些屬性。特別是一下這些:尺寸相關:offsetHeight、clientHeight、scrollHeight…

pm2 start 帶參數_3款有海景天窗的國產SUV,最適合帶女朋友看星星,首付3萬拿下...

夏天就這么緩緩地來了,在某一個周末的晚上,約上心愛的女朋友,開上車子,一路上馳騁在無人的大橋上,放上音樂,開到目的地,打開天窗,看看星星,從詩詞歌賦談到人生哲學&#…

html仿京東快速購物導航,jQuery仿京東樓層滑動側邊欄高亮(原創)

插件描述:jQuery模仿京東側邊欄點擊滑動到該樓層,同時側邊欄隨著頁面滾動對應導航高亮。更新時間:2017/9/30 下午2:48:37更新說明:1,添加了查看評論按鈕來改變對應區的高度2,將floorList和navList作為匿名函…

華為云大數據存儲的冗余方式是三副本_華為TaurusDB技術解讀(轉載)

近日,華為云自研關系型數據庫 Taurus 公開亮相。作為華為云自研的最新一代云原生分布式數據庫,Taurus 完全兼容 MySQL 8.0,采用計算與存儲分離、日志即數據的架構設計,支持 1 寫 15 讀,性能達到原生 MySQL 的 7 倍。性…

spring html訪問統計,spring-mvc訪問本地html文件(示例代碼)

項目中要用到在線預覽word文檔,剛開始考慮是要將word轉成pdf文件,然后再直接在瀏覽器打開pdf文檔即可,但是項目部署在Linux下,在網上搜了一下沒有找到合適的方法,后來項目組討論用POI生成HTML文件,但是生成…

unity 是厘米還是米_喬丹19歲才1.75米,2年增高近20公分,這個長高方法你能堅持多久...

相信現在有很多的人希望自己在長大之后能去NBA打籃球,但是因為種種原因,最后還是放棄了這個想法, 很多人是因為自己的身體素質達不到要求,比如說天賦上沒有達到一個籃球運動員的身高,還有的是因為自己家庭的原因最后放…

win7變成xp風格了怎么改回_微軟看了會沉默,把 Windows 10 變成經典 98 風格

眾所周知「Windows 10」官方提供的主題都只是換換壁紙,所以喜歡折騰的小伙伴會選擇用「UltraUXThemePatcher」來讓「Windows 10」支持第三方主題,實現模仿各種風格,如 macOS、Win7、Ubuntu 等。但是由于「Windows 10」版本太多,導…

2021廣東高考成績排名如何查詢,2021年廣東高考個人排名怎么查詢,廣東高考成績排名查詢方法...

高考成績公布后,很多家長和學生咨詢我們,廣東高考個人成績排名位次如何查詢:廣東高考成績排名,可以通過省招生考試院發布的廣東一分一段表來查詢,也可以到聚志愿網站直接輸入分數查詢,一分一段它顯示每一個…

區塊如何防篡改_深入淺出:一條數據是如何完成上鏈的

一筆業務數據在區塊鏈處理的流程大致分為三個階段:分別是上鏈前處理階段、鏈上處理階段和智能合約處理階段。一.上鏈前處理階段業務數據上鏈前需要將業務數據處理,并且對信息進行簽名。這些過程可以通過對應的工具,比如序列化工具和各種橢圓曲…

鎖定計算機在哪里設置方法,怎樣鎖定電腦?如何設置電腦鎖屏【步驟詳解】

我們在日常使用電腦的時候,特別是自己的私人電腦時,難免會遇到上個廁所接個水之類的雜事需要離開位置的,也許可能就一兩分鐘不到的時間,這么點的時間如果關機的話又覺得實在是太麻煩了,但是又不想讓其它的人知道我們的…

python 安裝html,python安裝glob

python 里面的glob模塊是怎么用的新手剛學這一塊內容,不是很懂 這個模塊可以用來統計每個類型物品的統計glob是python自己帶的一個文件操作相關模塊,用它可以查找符合自己目的的文件,就類似于Windows下的文件搜索,支持通配符操作,…

hough變換檢測圓周_Python OpenCV 霍夫變換

霍夫變換(Hough Transform)是圖像處理中的一種特征提取技術,它通過一種投票算法檢測具有特定形狀的物體。Hough變換是圖像處理中從圖像中識別幾何形狀的基本方法之一。Hough變換的基本原理在于利用點與線的對偶性,將原始圖像空間的給定的曲線通過曲線表達…

關于未來計算機的想象作文600字,未來世界的想象作文600字

我背著書包漫無目的地走在街上,剛要出門的時候突然出現了一個大洞,我本想上前一看究竟,結果被石子絆了下去,一下就落進了那個黑洞里,我的世界陷入了一片黑暗。不知過了多久,我眼睛好不容易看到一絲光亮&…

creator qt 字體太小_qt ttf 字體太小的解決方法

編譯完成qt以后,發現qt的字體太小了原因是qt的dpi計算錯誤,這樣的情況會導致qt在不同的平臺上大小不一解決的方法就是設置好qt的dpi,qt是根據顯示器的物理長度或者寬度于分辨率的關系來計算dpi的,所以我們設置exportQWS_DISPLAY"LinuxFB:mmWidth95:0"export QWS_SIZE…

當前超級計算機的應用方興未艾,四川省若爾蓋縣高三下學期語文模擬卷(五)

四川省若爾蓋縣高三下學期語文模擬卷(五)姓名:________ 班級:________ 成績:________一、選擇題 (共3題;共6分)1. (2分)(2017海南模擬) 下列各句中劃線成語的使用,全都正確的一項是()①與做人一樣,李天來對待試驗同樣謹小慎微。他說&#xff…