標記語言——標題
互聯(lián)網(wǎng) 發(fā)布時間：2008-10-17 18:55:27 作者：佚名 
我要評論
我要評論點擊這里返回網(wǎng)頁教學(xué)網(wǎng) HTML教程 欄目．
上文：Chapter1 清單
原文出處
標準化設(shè)計解決方案 - 標記語言和樣式手冊
Web Standards Solutions The Markup and Style Handbook
Part 1: Get Down With Markup 從標記語法談起
Chapter2 標題
總覽:
不但
點擊這里返回腳本之家 HTML教程 欄目．
上文：Chapter1 清單
原文出處
標準化設(shè)計解決方案 - 標記語言和樣式手冊
Web Standards Solutions The Markup and Style Handbook
Part 1: Get Down With Markup 從標記語法談起
Chapter2 標題
總覽:
不但所有網(wǎng)頁都需要有標題,而且如果標記正確的話,他們能為網(wǎng)頁設(shè)計和易用性增色不少.
從外觀來說,網(wǎng)頁的標題通常是使用較大的字號,或許會用和主體文字不同的顏色或者字體.標題的作用是"簡要的描述往后章節(jié)所討論的主題",W3C這樣描述 — 顯示網(wǎng)頁內(nèi)各個段落的概要.
怎樣來創(chuàng)建一個頁面標題來使得我們要展現(xiàn)的信息得到最有效的利用?在這個章節(jié)中,我們將研究幾種常用的處理標題的方法,試著從中找出其中一種對我們最有幫助的方式,然后,我們將使用一些css的技巧和竅門來為最棒的方法裝飾一番.
創(chuàng)建文檔標題的最好方法是什么?
在回答這個問題之前,讓我們假設(shè)現(xiàn)在正要把標題放置在文檔的頁首,我們來看看能夠達成類似效果的三種方式.
方法A:有意義嗎?
<span class="heading">Super Cool Page Title</span>
雖然<span>標簽在某些場合會是個方便的標簽,但是對于頁面標題來說,它的意義并不大,使用這個方法的唯一好處是我們可以為 heading 類指定一個css樣式,以便讓文字看起來像是個標題.
.heading {
font-size: 24px;
font-weight: bold;
color: blue;
}
現(xiàn)在,所有標記了heading類的標題都會變大,變粗,變藍,很棒對吧?但是,如果有人使用一個不支持css的瀏覽器訪問這個頁面會怎么樣呢?
舉例來說,如果我們把css樣式放在舊瀏覽器不支持的外部樣式表文件里 — 或者屏幕閱讀器為有障礙的用戶朗讀頁面時會怎么樣呢?通過這些途徑訪問這個頁面的使用者將看不到(聽不到)標題和正文文字的差異.
class="heading"這樣的標注方法稍~~微的描述了標簽內(nèi)容的意義,但是<span>只是個一般用途的容器,只是讓大部分瀏覽器改變默認顯示樣式而已.
搜索引擎在抓取到這個頁面時,會跳過<span>標簽就像它不曾在那邊一樣,不會為里面可能包含的關(guān)鍵字提升權(quán)重,稍后在本章節(jié)內(nèi)會提到更多搜索引擎和頁面標題的關(guān)系.
最后,由于<span>標簽是一個行內(nèi)元素,我們大多需要把方法A的內(nèi)容在放置到另一個塊級容器中,比方說<p>或者<div>,以便讓它獨占一行.這樣會生成許多不必要的代碼,就算你加上需要的容器,不支持css的瀏覽器仍然會以他本來的方式顯示文字,讓用戶看不出標題和正文的任何區(qū)別.
上文：Chapter1 清單
原文出處
標準化設(shè)計解決方案 - 標記語言和樣式手冊
Web Standards Solutions The Markup and Style Handbook
Part 1: Get Down With Markup 從標記語法談起
Chapter2 標題
總覽:
不但所有網(wǎng)頁都需要有標題,而且如果標記正確的話,他們能為網(wǎng)頁設(shè)計和易用性增色不少.
從外觀來說,網(wǎng)頁的標題通常是使用較大的字號,或許會用和主體文字不同的顏色或者字體.標題的作用是"簡要的描述往后章節(jié)所討論的主題",W3C這樣描述 — 顯示網(wǎng)頁內(nèi)各個段落的概要.
怎樣來創(chuàng)建一個頁面標題來使得我們要展現(xiàn)的信息得到最有效的利用?在這個章節(jié)中,我們將研究幾種常用的處理標題的方法,試著從中找出其中一種對我們最有幫助的方式,然后,我們將使用一些css的技巧和竅門來為最棒的方法裝飾一番.
創(chuàng)建文檔標題的最好方法是什么?
在回答這個問題之前,讓我們假設(shè)現(xiàn)在正要把標題放置在文檔的頁首,我們來看看能夠達成類似效果的三種方式.
方法A:有意義嗎?
<span class="heading">Super Cool Page Title</span>
雖然<span>標簽在某些場合會是個方便的標簽,但是對于頁面標題來說,它的意義并不大,使用這個方法的唯一好處是我們可以為 heading 類指定一個css樣式,以便讓文字看起來像是個標題.
.heading {
font-size: 24px;
font-weight: bold;
color: blue;
}
現(xiàn)在,所有標記了heading類的標題都會變大,變粗,變藍,很棒對吧?但是,如果有人使用一個不支持css的瀏覽器訪問這個頁面會怎么樣呢?
舉例來說,如果我們把css樣式放在舊瀏覽器不支持的外部樣式表文件里 — 或者屏幕閱讀器為有障礙的用戶朗讀頁面時會怎么樣呢?通過這些途徑訪問這個頁面的使用者將看不到(聽不到)標題和正文文字的差異.
class="heading"這樣的標注方法稍~~微的描述了標簽內(nèi)容的意義,但是<span>只是個一般用途的容器,只是讓大部分瀏覽器改變默認顯示樣式而已.
搜索引擎在抓取到這個頁面時,會跳過<span>標簽就像它不曾在那邊一樣,不會為里面可能包含的關(guān)鍵字提升權(quán)重,稍后在本章節(jié)內(nèi)會提到更多搜索引擎和頁面標題的關(guān)系.
最后,由于<span>標簽是一個行內(nèi)元素,我們大多需要把方法A的內(nèi)容在放置到另一個塊級容器中,比方說<p>或者<div>,以便讓它獨占一行.這樣會生成許多不必要的代碼,就算你加上需要的容器,不支持css的瀏覽器仍然會以他本來的方式顯示文字,讓用戶看不出標題和正文的任何區(qū)別.
相關(guān)文章
- HTML表格用于在網(wǎng)頁上展示數(shù)據(jù),通過標簽及其相關(guān)標簽來創(chuàng)建,表格由行和列組成,每一行包含一個或多個單元格,單元格可以包含文本、圖像、鏈接等元素,本文將詳細介紹HTML表格2025-03-12
- 本文介紹了三種禁止HTML頁面滾動的方法：通過CSS的overflow屬性、使用JavaScript的滾動事件監(jiān)聽器以及使用CSS的position:fixed屬性,每種方法都有其適用場景和優(yōu)缺點，感興2025-02-24
在 Web 開發(fā)中，文本的視覺效果是提升用戶體驗的重要因素之一,通過 CSS 技巧，我們可以創(chuàng)造出許多獨特的效果，例如文字鏤空效果,本文將帶你一步一步實現(xiàn)一個簡單的文字鏤空2024-11-17
在Html中,a標簽?zāi)J的超鏈接樣式是藍色字體配下劃線,這可能不滿足所有設(shè)計需求,如需去除這些默認樣式,可以通過CSS來實現(xiàn),本文給大家介紹Html去除a標簽的默認樣式的操作代碼2024-09-25- 在HTML中,可以通過設(shè)置CSS的resize屬性為none,來禁止用戶手動拖動文本域（textarea）的大小,這種方法簡單有效,適用于大多數(shù)現(xiàn)代瀏覽器,但需要在老舊瀏覽器中進行測試以確保2024-09-25
本文詳細介紹了如何利用HTML和CSS實現(xiàn)多種風(fēng)格的進度條,包括基礎(chǔ)的水平進度條、環(huán)形進度條以及球形進度條等,還探討了如何通過動畫增強視覺效果,內(nèi)容涵蓋了使用HTML原生標簽2024-09-19- Canvas 提供了一套強大的 2D 繪圖 API，適用于各種圖形繪制、圖像處理和動畫制作,可以幫助你創(chuàng)建復(fù)雜且高效的網(wǎng)頁圖形應(yīng)用，這篇文章主要介紹了HTML中Canvas關(guān)鍵知識點總結(jié)2024-06-03
html table+css實現(xiàn)可編輯表格的示例代碼
本文主要介紹了html table+css實現(xiàn)可編輯表格的示例代碼，主要使用HTML5的contenteditable屬性，文中通過示例代碼介紹的非常詳細，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)2024-03-06
本文主要介紹了HTML中使用Flex布局實現(xiàn)雙行夾批效果，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)2024-02-22
在網(wǎng)站開發(fā)中，登錄頁面是必不可少的一部分，本文就來介紹一下HTML+CSS實現(xiàn)登錄切換，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需2024-02-02
