首頁 web前端 H5教程 HTML5的結構與語意(2):結構_html5教學技巧

HTML5的結構與語意(2):結構_html5教學技巧

May 16, 2016 pm 03:51 PM
div href 結構 語意


  由於缺乏結構,即使是形式良好的 HTML 頁面也比較難以處理。必須分析標題的級別,才能看出各部分的劃分方式。側邊欄、頁尾、頁首、導覽條、主內容區和各篇文章都由通用的 div 元素來表示。 HTML 5 增加了一些新元素,專門用來識別這些常見的結構:
 · section:這可以是書中的一章或一節,實際上可以是在HTML 4 中有自己的標題的任何東西
 · header:頁面上顯示的頁眉;與head 元素不一樣
 · footer:頁腳;可以顯示電子郵件中的簽名
 · nav:指向其他頁面的一組連結
 · article:blog、雜誌、文章彙編等中的一篇文章
  我們來考慮一個典型的 blog 主頁,它的頂部有頁眉,底部有頁腳,還有幾篇文章、一個導航區和一個邊欄,見代碼1 典型的 blog 頁面


Mokka mit Schlag




>
Mokka mit Schlag




"/blog/birding/2007/04/23/spring-comes-and-goes-in-sussex-county/">
Spring Comes (and Goes) in Sussex County



Yesterday I joined the Brooklyn Bird Club for our
annual trip to Western New Jersey, specifically Hyper
Humus, a relatively recently discovered hot spot. as a nice winter morning when we arrived
at the site at 7:30 A.M., progressed to Spring around
10:00 A.M., and reached early s by 10:15.



"/blog/birding/2007/04/23/but-does-it-count-for-your-life -list/"> But does it count for your life list?




Seems you can now go href="http:> href="http: //www.wired.com/science/discoveries/news/
2007/04/cone_sf">bird watching via the Internet
. I
haven't been able to test it out yet (20 user
limit apparently) but this is certainly cool.
Personally, I can't imagine it replacing
actually being out in the field by any small amount. On the ways found it quite
sad to meet senior birders who are no longer able to
hold binoculars steady or get to the park. I can
imagine this might be of some interest to them。 elderly birder did a big year on TV, after
he could no longer get out so much. This certainly
tops that.


« _fcksavedurl=""/blog/page/2/">«" Previous Entries

March 2007
January 2007 Copyright 2007 Elliotte Rusty Harold


  即使有正確的縮進,這些巢狀的 div 仍然讓人覺得非常混亂。在 HTML 5 中,這些元素可以替換為語意性的元素,請參閱程式碼2 用 HTML5編寫的典型blog頁面


Mokka mit Schlag






>Mokka mit Schlag




"/blog/birding/2007/0044 /23/spring-comes-and-goes-in-sussex-county/">
Spring Comes (and Goes) in Sussex County


Yesterday I joined the Brooklyn Bird Club for our
annual trip to Western New Jersey, specifically Hyper
Humus, a relatively recently discovered hot spot. It
started out as a nice winter morning when we arrive at A.M., and reached early summer by 10:15.



"/blog/birding/2007/04/23/but-does-it-count-for-your-life-list/">
But does it count for your life list?


Seems you can now go href="http://www.wired.com/science/discoveries/news/
2007/04/cone_sf">bird watching via the Internet
. I
haven't been able to test it out yet (20 user
limit apparently) but this is certainly cool.
人in the field by any small amount.
On the other hand, I've always found it quite
sad to meet senior birders who are no longer able to

hold binoculars steaders who are no longer able to
hold binoculars steady parkor get to the y parkor I. can
imagine this might be of some interest to them. At
least one elderly birder did a big year on TV, after
« _fcksavedurl=""/blog/page/2/">«" Previous Entries
March 2007



>
January 2007


>Copyright 2007 Elliotte Rusty Harold   現在不再需要 div 了。不再需要自己設定 class 屬性,從標準的元素名稱就可以推論出各個部分的意義。這對於音訊瀏覽器、手機瀏覽器和其他非標準瀏覽器尤其重要。     (待續)
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

src和href是什麼意思 src和href是什麼意思 Aug 16, 2023 pm 05:00 PM

src和href分別是,1、src是source的縮寫,用來指定外部資源的路徑,通常用於嵌入外部文件,例如圖片、音訊、視訊等,src屬性一般用在img、script、iframe等標籤上;2、href是hypertext reference的縮寫,用於指定超連結的目標資源的路徑,通常用於連結到外部文件或其他頁面,href屬性一般用在a、link等標籤上。

lambda 表達式的語法和結構有什麼特色? lambda 表達式的語法和結構有什麼特色? Apr 25, 2024 pm 01:12 PM

Lambda表達式是無名稱的匿名函數,其語法為:(parameter_list)->expression。它們具有匿名性、多樣性、柯里化和閉包等特徵。在實際應用中,Lambda表達式可用於簡潔地定義函數,如求和函數sum_lambda=lambdax,y:x+y,並透過map()函數應用於列表來進行求和操作。

css怎麼實作div缺一個角 css怎麼實作div缺一個角 Jan 30, 2023 am 09:23 AM

css實作div缺少一個角的方法:1、建立一個HTML範例文件,並定義一個div;2、給div設定寬高背景色;3、給需要刪除一角的div增加一個偽類,將偽類設定成跟背景色一樣的顏色,然後旋轉45度,再定位到需要去除的那個角落即可。

internet的基本結構與技術起源於什麼 internet的基本結構與技術起源於什麼 Dec 15, 2020 pm 04:48 PM

internet的基本架構與技術起源於ARPANET。 ARPANET是電腦網路技術發展中的一個里程碑,它的研究成果對促進網路技術的發展起到了重要的作用,並未internet的形成奠定了基礎。 arpanet(阿帕網)為美國國防部高級研究計劃署開發的世界上第一個運營的數據包交換網絡,它是全球互聯網的始祖。

深入解析MySQL.proc表的結構及用途 深入解析MySQL.proc表的結構及用途 Mar 15, 2024 pm 02:36 PM

MySQL.proc表是MySQL資料庫中儲存預存程序和函數資訊的系統表,透過深入了解其結構及用途,可以更好地理解預存程序和函數在MySQL中的運作機制,並進行相關的管理和最佳化。以下將詳細解析MySQL.proc表的結構及用途,並提供具體的程式碼範例。 1.MySQL.proc表的結構MySQL.proc表是一個系統表,儲存了所有預存程序和函數的定義和相關信息

基於 ChatGPT API 的劃詞翻譯瀏覽器腳本實現 基於 ChatGPT API 的劃詞翻譯瀏覽器腳本實現 May 01, 2023 pm 03:28 PM

前言最近GitHub上有個基於ChatGPTAPI的瀏覽器腳本,openai-translator,短時間內star衝到了12k,功能上除了支援翻譯外,還支援潤飾和總結功能,除了瀏覽器插件外,還使用了tauri打包了一個桌面客戶端,那拋開tauri是使用rust部分,那瀏覽器部分實作還是比較簡單的,今天我們就來手動實作一下。 openAI提供的介面例如我們可以複製以下程式碼,在瀏覽器控制台中發起請求,就可以完成翻譯//範例constOPENAI_API_KEY="s

如何使用HTML和CSS實作一個具有固定導航選單的佈局 如何使用HTML和CSS實作一個具有固定導航選單的佈局 Oct 26, 2023 am 11:02 AM

如何使用HTML和CSS實現一個具有固定導航選單的佈局在現代網頁設計中,固定導航選單是常見的佈局之一。它可以使導航選單始終保持在頁面頂部或側邊,使用戶可以輕鬆瀏覽網頁內容。本文將介紹如何使用HTML和CSS實作一個具有固定導航選單的佈局,並提供具體的程式碼範例。首先,需要建立一個HTML結構來呈現網頁的內容和導覽選單。以下是一個簡單的範例

iframe和div有什麼不同 iframe和div有什麼不同 Aug 28, 2023 am 11:46 AM

iframe和div的不同是iframe主要用於引入外部內容,可以載入其他網站的內容或將一個網頁分割成多個區域,每個區域有自己的獨立的瀏覽上下文,而div主要用於分割和組織內容的區塊,用於佈局和样式控制。

See all articles