html5组织内容.pdf

html5 组织内容 默认情况下，HTML 文档的格式与文档内容在浏览器窗口中显示的格式是不相关的，例如：浏览器会将连在一起的几个 空白字符折算为一个空格，并且会忽略换行符。HTML 提供了组织内容的方式，将显示的内容分段，预先编排内容的格式等。 建立段落 HTML 会忽略你在文本中输入的回车符和其他额外的空格，网页中的新的段落使用 p 元素标识，一个段落包含一个或多个相 关句子，通常围绕的是一个观点或论点，或者多个论点间有一些共同的主题。 1. body 2. h1Antoni Gaudí/h1 3. pMany tourists are drawn to Barcelona 4. to see Antoni Gaudís incredible 5. architecture./p 6. pBarcelona celebrated the 150th 7. anniversary of Gaudís birth in 8. 2002./p 9. /body 可以为段落添加样式，包括字体、字号、颜色等。 div 元素 div 元素没有具体的含义，如果没有恰当的元素可用时可以使用这个元素为内容建立结构并赋予其含义，它的含义通常通过 class 或 id 属性指定。 但是注意不在万不得已的情况下最好不要使用 div 元素，应该优先考虑那些具有语义重要性的元素。 预先编排内容格式 浏览器会将所有额外的回车和空格压缩，并根据窗口的大小自动换行。pre 元素可以改变浏览器处理内容的方式，阻止合并 空白字符，让源文档中的格式得以保留。但注意除非有必要保留文档原始格式，否则最好不要使用该元素，因为它削弱了通 过使用元素和样式来控制呈现结果这一机制的灵活性。 pre 元素通常和 code 元素搭配使用，用于展示代码示例，因为编程语言中的格式通常都很重要。 1. pAdd this to your style sheet if you want 2. to display a dotted border underneath the 3. code abbr/code element whenever it has 4. a code title /code attribute./p 5. pre 6. code 7. abbr[title] { 8. border-bottom: 1px dotted #000; 9. } 10. /code 1 / 6 11. /pre 引用他处内容 blockquote 元素表示引自他处的一片内容，与 q 元素类似（用于短的引述，不能跨行），但通常用在要引用的内容较多的 场景。该元素的 cite 属性可以用来指定所引用的内容的来源。 1. blockquote cite=/wiki/AppleThe apple forms a tree that is small and decidu ous, /blockquote 注意浏览器会忽略 blockquote 元素中的内容的格式，默认对 blockquote 文本进行缩进。要在引用中建立结构，可以使用 一些组织元素，例如 p 或 hr。 浏览器应对 q 元素中的文本会自动加上特定语言的引号，但不同的浏览器的效果会有差异。下面是使用 q 元素的一个例子。 1. pShe tried again, this time in French: 2. q lang=frAvez-vous lu le livre cite 3. lang=enHigh Tide in Tucson /cite de 4. Kingsolver? Cest inspirational./q/p 添加主题分隔 hr 元素代表段落级别的主题分隔。在 HTML5 中，hr 元素代表着向另一个相关主题的转换，习惯样式是一条横贯页面的直线。 1. blockquote cite=/wiki/Apple 2. 主题 1