标题标签指的是<h1>~<h6>这6个标签,统称为<hx>标签。

(1)在页面内容的标题部分使用<hx>标签

  

 <h1 class="reader-title">Holman Christian Standard Bible</h1>

(2)页面中只使用一个<h1>标签

  为了保证页面<hx>标签的合理设置,使用一个<h1>标签作为页面标题,页面各模块的标题从<h2>开始设置。

(3)<hx>标签使用过程中不要跳级

  在某些情况下,页面的设计可能并不期望某一层级的标题显示,在开发过程中也会删除这一标题,从而导致标题层级的断开。推荐的做法是,把不在页面中显示的标题隐藏,而不是删除。

 <h1 class="hide">BBC Homepage</h1>

(4)不要单纯使用<hx>标签给内容设置样式

  HTML代码只关注语义不关注其外观,所有页面的外观都应该通过CSS样式控制,HTML和CSS应该各司其职。

WEB学习笔记11-高可读性的HTML之如何设置网页标题层级的更多相关文章

  1. [原创]java WEB学习笔记11:HttpServlet(HttpServletRequest HttpServletRsponse) 以及关于 Servlet 小结

    本博客为原创:综合 尚硅谷(http://www.atguigu.com)的系统教程(深表感谢)和 网络上的现有资源(博客,文档,图书等),资源的出处我会标明 本博客的目的:①总结自己的学习过程,相当 ...

  2. [原创]java WEB学习笔记75:Struts2 学习之路-- 总结 和 目录

    本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱 ...

  3. Java Web 学习笔记 1

    Java Web 学习笔记 1 一.Web开发基础 1-1 Java Web 应用开发概述 1.1.1 C/S C/S(Client/Server)服务器通常采用高性能的PC机或工作站,并采用大型数据 ...

  4. Java Web学习笔记之---EL和JSTL

    Java Web学习笔记之---EL和JSTL (一)EL (1)EL作用 Expression  Language(表达式语言),目的是代替JSP页面中复杂的代码 (2)EL表达式 ${变量名} ( ...

  5. JAVA Web学习笔记

    JAVA Web学习笔记 1.JSP (java服务器页面) 锁定 本词条由“科普中国”百科科学词条编写与应用工作项目 审核 . JSP全名为Java Server Pages,中文名叫java服务器 ...

  6. [原创]java WEB学习笔记95:Hibernate 目录

    本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱 ...

  7. [原创]java WEB学习笔记66:Struts2 学习之路--Struts的CRUD操作( 查看 / 删除/ 添加) 使用 paramsPrepareParamsStack 重构代码 ,PrepareInterceptor拦截器,paramsPrepareParamsStack 拦截器栈

    本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱 ...

  8. Ext.Net学习笔记11:Ext.Net GridPanel的用法

    Ext.Net学习笔记11:Ext.Net GridPanel的用法 GridPanel是用来显示数据的表格,与ASP.NET中的GridView类似. GridPanel用法 直接看代码: < ...

  9. java web 学习笔记 编码问题总结

       java web 学习笔记 编码问题总结 1.非form表单中提交的中文参数---------------------------传递给Servlet服务器时,默认以iso-8859-1解码 ...

随机推荐

  1. 微信小程序分享及信息追踪

    我就是个搬用工—来源:https://www.jianshu.com/p/87a75ec2fd53 小程序分享群及信息追踪 需求 页面分享 ​ 小程序页面分享链接增加source参数,值为用户ID加密 ...

  2. Android proguard混淆签名打包出现"android proguard failed to export application"解决方案

    刚刚接触安卓,不是很熟悉.发现之前可以正常打包的项目出现添加混淆再进行打包签名的APK之后提示"android proguard failed to export application&q ...

  3. OSS文件上传到阿里云

    <script src="http://gosspublic.alicdn.com/aliyun-oss-sdk-4.4.4.min.js"></script&g ...

  4. oracle存储过程出现ORA-01403: 未找到数据 问题解决方法

    这段时间在做一个业务,需要用到存储过程处理业务逻辑,但是出现一个ORA-01403: 未找到数据 问题, 那么这个应该如何解决这个问题 declare mixType integer; begin - ...

  5. 构建微服务:Spring boot 入门篇

    什么是Spring Boot Spring Boot 是由 Pivotal 团队提供的全新框架,其设计目的是用来简化新 Spring 应用的初始搭建以及开发过程.该框架使用了特定的方式来进行配置,从而 ...

  6. 7ci

  7. CodeForces - 1101B

    题目: B. Accordion time limit per test 3 seconds memory limit per test 256 megabytes input standard in ...

  8. JS 函数参数 及 函数数组

    <script> function a(){ alert("a"); } function b(){ alert("b"); } var arr = ...

  9. Mybatis第一天

    Mybatis第一天   框架课程 1.   课程计划 第一天: 1.Mybatis的介绍 2.Mybatis的入门 a)       使用jdbc操作数据库存在的问题 b)      Mybatis ...

  10. 关于ijkplayer下载的demo不能运行,这是因为FFmpeg

    前提是你在Mac上已经配置了 homebrew 包管理工具 关于ijkPlayer的demo和framework的使用,也许当直接下载下来不能使用,这时候你需要再你下载的当前目录下运行,你看下自己的目 ...