html的那些标签们

作者: 孙静静 | 来源:发表于2017-08-22 21:09 被阅读76次

今天来谈谈html的那些标签,首先,HTML有那些标签呢?我们常见的有div, span,h1,h2,h3,p,img,a,ul,li,ou,dl,dt,dd等等,那么接下来介绍一些常见的标签。

最最常见的div,所有学前端的一定不陌生,简称万能的标签,基本所有的标签都可以用div加上css来解决,那么这里div和span标签我们就不介绍了,不了解的可以参考下我之前的文档。

下面来说说h系列标签,最常用的是h1,h2,h3标签,h系列标签基本属性如下:

h1,h2,h3


h1标签为一级标签,一般一个页面只有一个h1标签,用于大标题的作用;由于一些浏览器会默认地把<h1>元素显示为很大的字体,因此会有一些 web 开发者使用<h2>元素代替<h1>元素来显示最上层的标题。这样做不会对读者产生影响,但会使那些试图“理解网页结构”的搜索引擎和其他软件感到迷惑。请确保把用于最顶层的标题,和用于较低的层级。

h2标签为二级标签,一般用于模块里的标题;h3标签为三级标签,适用于再次要栏目或分类小标题。h2和h3标签无限制使用次数。h标签可以使用CSS样式初始化h1 h2 h3 标签代码:

                                                        H1,h2,h3,h4{font-size:12px; font-weight:normal}

我们初始化了字体大小设置为12px,去除了H1 H2 H3 H4文字加粗样式。根据范例可扩展运用.


p标签

p标签为段落标签,用于文字部分,p标签的默认属性如下:

p标签

img标签

img标签为图片标签,图片标签 ,单标签 ,比较特殊,虽然为行级标签,但是可以设置尺寸,支持宽高属性 ,不需要加单位 ,一般宽高只设置一个

img标签

src属性里加的是图片的地址,可以是绝对地址和相对地址,alt属性主要有两个功能,一是但图片加载失败的时候,提示图片信息,二是作为搜索引擎爬虫的关键字将进行搜索;同时src还有width和heiht属性,可以直接设置,不用加单位。

ol,ul,li标签

ol标签和li标签属于嵌套标签,缺一不可,必须同时使用,中间不能有其他标签,为有序标签;ul和li组合是无序列表,默认属性如下:

ol,li,ul标签

其中利用list-style-type:none可以去除默认样式里的list-style-type里的样式,可以用于网页中相同样式的模块,比如今日头条的左边栏。

a标签

a标签可以说是我们最常见的标签之一了,可以说没有a标签我们的网页就是死的,可以看出来a标签的重要性。那么a标签有哪些基本属性呢?

a标签

a标签的常见属性有

a标签

其中href为跳转地址,里面接的是网站的地址,是a标签中必不可少的一部分,同时href不加链接的时候可以加#,但是需要注意的是,加一个#点击a标签的时候或回到头部,这样就出现了牟链接,例如:

a标签

这样点击a标签就来到了box1位置,网页里的返回头部或者返回本页面的另个位置就是这样做的。

同时a标签还有四种状态:伪类设置

link状态 链接未浏览状态

visited状态 链接已被访问过

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

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

a标签

其中这四种设置前两个顺序是固定的,后两个顺序可以调换,还需要注意的是,hover的时候,设置其他属性效果是其他几种状态共有的!

常见标签暂时只介绍到这里。



相关文章

  • html的那些标签们

    今天来谈谈html的那些标签,首先,HTML有那些标签呢?我们常见的有div, span,h1,h2,h3,p,i...

  • Html常用标签介绍

    在前端开发工作中,常用的html标签有: 1.文档元数据标签 标签:表示那些不能由其它Html院相关标签( , ,...

  • 参考别人的 -- 那些你不知道的HTML标签

    那些你不知道的HTML标签 原文链接:那些你不知道的HTML标签 有人说HTML很简单,都不能称得上是一门语言,以...

  • html标签

    html标签属性大全(完美版) html标签属性大全是朋友们整理常用的html标签,和大家更好的交流沟通。学习ht...

  • h5+css黑马笔记

    HTML5 新增标签 新增了那些语义化标签header --- 头部标签nav --- 导航...

  • HTML标签那些事

    目录: 一. 一些HTML偏冷知识 二. HTML5语义化标签 一. 一些HTML偏冷知识 contentedit...

  • H5新增语义化标签

    HTML5 新增标签 什么是语义化 新增了那些语义化标签header --- 头部标签nav ...

  • Html 学习笔记

    HTML基础 HTML 标签 HTML 标记标签通常被称为 HTML 标签 (HTML tag) HTML 标签通...

  • HTML常用标签

    HTML标签:标记标签通常被称为HTML标签,HTML标签是HTML语言中最基本的单位,HTML标签是HTML最重...

  • HTML 常用的标签

    什么是 HTML 标签 HTML 文档和 HTML 元素是通过 HTML 标签进行标记的 HTML 标签由开始标签...

网友评论

    本文标题:html的那些标签们

    本文链接:https://www.haomeiwen.com/subject/mhxrdxtx.html