常用标签

对于常用标签div和span 就不多说了,在我们开始接触HTML5的时候最先了解的就应该是他们了。div和span固然好用但不足够适应浏览器对语义的要求。今天我们就大概总结一下一些常用的标签。

1.h1~h6标签 块标签 ,双标签,h系列标签的默认样式display:block;font-weight:bold;

h1m~h6标签的默认字体大小依次为:(浏览器默认为body:100%=16px;)

浏览器计算得出h1=32px h2=24px h3=18.72px h4=16px h5=13.28px h6=12px

h1~h6的使用:一般情况下一个页面建议只用一个H1,页会H1给LOGO或者文字的网站名称;分类、列表等都会给分类、列表名称;详情页会给文章名、商品名称等;h2~h6我们可以根据页面的区域划分,在一些模块中的小标题上使用,一般使用的都是h2,并且按照h系列标签的等级特性,一般只需要用到h3或者h4就够了。

2.p标签 块标签 双标签 p标签的默认样式:有默认的上下16px的外边距

ps:p标签内不能嵌套块标签

3.有序列表: ol与li不能单独使用,ol与li 之间不能出现其他标签  

无序列表:ul与li  

自定义列表:dt 定义列表中的项目 dd 描述列表中的项目

li的display:list-item列表项

列表的使用场景:样式与结构相似或者相同的集合可以使用列表

4.a标签 行标签但比较特殊,它可以设置宽度和高度 a标签只能跳转.html文件和页面内的模个区域

超链接标签的四种状态:伪类设置

link状态 链接为浏览状态

visited状态 链接以访问过

hover状态 鼠标悬浮在链接上的状态

active状态 鼠标点击未松开的状态

ps:1.link和visited状态时,不能乱用样式,场景-设置该状态下地默认字体样式

2.当a标签的href属性为空时。我们可以用href=“#”或者href=“###”或href=“javascript:void();”不让它跳转,当使用href=“#”时会出现点击时返回顶部的效果(hash 哈希 #返回顶部)

3.我们可以给href属性设置成页面内的某个ID,这样就能跳转到指定的区域(hash定位)

5.img标签 图片编码base64,优化图片的的加载 就是把图片通过编码,把生成的编码设置为src的值

6.hr  分割线  块标签 单标签

7.sub 定义下标文本 sup 定义下标文本 del 定义删除线

7strong 定义强调标签(粗体加重) small 定义小字号文本 big 定义大字号

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 标题标签:h1~h6(一般h4以后不怎么用了) 双标签 无默认属性 块级标签 有默认的上下margin;font-...
    没_有_人阅读 3,785评论 2 4
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,680评论 1 92
  • 1.标题标签 h1~h6 双标签 无默认属性 块级。 有默认的上下margin;作为语义标签,常用于网页的标题,h...
    马大哈tt阅读 3,701评论 1 1
  • 标题标签:h1~h6 双标签 块级 无默认属性 段落标签:p 双标签 块级 有默认属性margin 不能嵌套块级...
    放飞吧自我阅读 1,462评论 1 1
  • 一. a标签 1.a标签是超链接标签、双标签、行级标签; 2.例如: (1)href="" 跳转地址 必须的 而且...
    星辰星成阅读 3,226评论 0 1