XHTML标记要合理使用

互联网   发布时间:2008-10-17 18:47:29   作者:佚名   我要评论
  在网页教学网以往的教程中,曾经多次强调使网页HTML文件具有语义。我们应该根据网页HTML文档的结构选择最合适的HTML或XHTML标签,而不是根据它们的外观样式去选择它们。使用P标签定义一个段落,而不是用它来获得换行效果。我们使用h1-h6标签标记标题,而不是用它们取得

  在脚本之家以往的教程中,曾经多次强调使网页HTML文件具有语义。我们应该根据网页HTML文档的结构选择最合适的HTML或XHTML标签,而不是根据它们的外观样式去选择它们。使用P标签定义一个段落,而不是用它来获得换行效果。我们使用h1-h6标签标记标题,而不是用它们取得文字大小与加粗的效果。
  例如一个标题,我们可以用h1来定义它:
  <h1>文章的标题文字写在这里</h1>
  而不应该使用其它的什么方式来定义它:
  <p style="font-size:16px; font-weight:bold;">文章的标题文字写在这里</p>
  在脚本之家以前的的文章里,我们列出了所有XHTML1.0允许使用的标签,我们也可以发现,其中可以让我们选择的元素标记其实是很少的。但我们也清晰的认识到,这些精炼的元素标记也更加有明确的意义。如果你实在找不到恰当的元素进行标记,那么可以使用通用的div与span标签。
  页面中div与span标签的使用是一个新问题,我们也容易过多的使用它们。必要及合理的使用div可以明显的增强文档的结构性。如果你审视你的HTML文档,发现有着很多的div与span,那你就得换一个眼光来看问题了,是不是存在滥用的情况?是不是还有更好的标记来替代它们?若h1可以更好的表示所标记的内容,那你就得放弃p或span来定义。
  或许这是一对矛盾,我们本身也较难把握该如何正确的使用它们,也或许我们根本就得不到一个明确的答案。但有一点需要阐明,我们应该使文档在逻辑上具有清晰的结构,而且更加容易应用样式。我们可以将div仅看着是一个容器,或者叫做文档的组成“部分”。我们使用太多的容器,并不是一个明智的模式。而恰到好处居于合理位置的容器,可以让整个文档显的很有条理。
  如下的代码,就比较合理有效:
<div id="header">
<h1>脚本之家jb51.net。欢迎您的到来</h1>
<h2>脚本之家Webjx.Com 提供最新最快的网页技术</h2>
<p>脚本之家jb51.net提供网页制作教程,动态网页制作教程,建站指南,Flash动画教程,视频教程,网页特效代码,网页素材,书籍下载等内容,希望给您的工作和学习能带去帮助。</p>
</div>

相关文章

  • HTML img标签和超链接标签详细介绍

    文章介绍了HTML中img标签的使用,包括src属性(指定图片路径)、相对/绝对路径区别、alt替代文本、title提示、宽高控制及边框设置等,本文主要给大家介绍HTML img标签和超链
    2025-06-20
  • HTML中meta标签的常见使用案例(示例详解)

    HTML meta标签用于提供文档元数据,涵盖字符编码、SEO优化、社交媒体集成、移动设备适配、浏览器控制及安全隐私设置,优化页面显示与搜索引擎索引,本文给大家介绍HTML中meta
    2025-06-20
  • HTML input 标签示例详解

    input 标签主要用于接收用户的输入,随 type 属性值的不同,变换其具体功能,本文通过实例图文并茂的形式给大家介绍HTML input 标签,感兴趣的朋友一起看看吧
    2025-06-20
  • html 滚动条滚动过快会留下边框线的解决方案

    这篇文章主要介绍了html 滚动条滚动过快会留下边框线的解决方案,解决方法很简单,可以将 dialog 单独拿出来别放在 transform 的子元素里,需要的朋友可以参考下
    2025-06-09
  • 在 HTML 文件中添加图片的常用方法

    本文将介绍如何使用<img>标签在 HTML 中添加图片,并展示一些常见的用法和技巧,通过本文的介绍,应该掌握了在 HTML 中添加和调整图片的基础知识,感兴趣的朋友一起看
    2025-05-16
  • HTML 表格详解(简单易懂较详细)

    HTML表格用于在网页上展示数据,通过标签及其相关标签来创建,表格由行和列组成,每一行包含一个或多个单元格,单元格可以包含文本、图像、链接等元素,本文将详细介绍HTML表格
    2025-03-12
  • 禁止HTML页面滚动的操作方法

    本文介绍了三种禁止HTML页面滚动的方法:通过CSS的overflow属性、使用JavaScript的滚动事件监听器以及使用CSS的position:fixed属性,每种方法都有其适用场景和优缺点,感兴
    2025-02-24
  • 使用HTML和CSS实现文字镂空效果的代码示例

    在 Web 开发中,文本的视觉效果是提升用户体验的重要因素之一,通过 CSS 技巧,我们可以创造出许多独特的效果,例如文字镂空效果,本文将带你一步一步实现一个简单的文字镂空
    2024-11-17
  • Html去除a标签的默认样式的操作代码

    在Html中,a标签默认的超链接样式是蓝色字体配下划线,这可能不满足所有设计需求,如需去除这些默认样式,可以通过CSS来实现,本文给大家介绍Html去除a标签的默认样式的操作代码
    2024-09-25
  • HTML文本域如何设置为禁止用户手动拖动

    在HTML中,可以通过设置CSS的resize属性为none,来禁止用户手动拖动文本域(textarea)的大小,这种方法简单有效,适用于大多数现代浏览器,但需要在老旧浏览器中进行测试以确保
    2024-09-25

最新评论