html中的标签元素大体被分为三种不同的类型:块状元素、内联元素和内联块状元素。
常用的状元素有:
<div>、<p>、<h1>...<h6>、<ol>、<ul>、<dl>、<table>、<address>、<blockquote> 、<form>
常用的内联元素有:
<a>、<span>、<br>、<i>、<em>、<strong>、<label>、<q>、<var>、<cite>、<code>
常用的内联块状元素有:
<img />、<input />

块级元素
什么是块级元素?在html中<div>、 <p>、<h1>、<form>、<ul> 和 <li>就是块级元素。设置display:block就是将元素显示为块级元素。如下代码就是将行内元素a转换为块状元素,使a元素具有块状元素特点。
a{display:block;}
块级元素特点:
1、每个块级元素都从新的一行开始,并且其后的元素也另起一行。(一个块级元素独占一行)
2、元素的高度、宽度、行高以及顶和底边距都可设置。
3、元素宽度在不设置的情况下,是它本身父容器的100%(和父元素的宽度一致),除非设定一个宽度。

行内元素
在html中,<span>、<a>、<label>、<input>、 <img>、 <strong> 和<em>就是典型的行内元素(inline)元素。当然块状元素也可以通过代码display:inline将元素设置为行内元素。如下代码就是将块状元素div转换为行内元素,从页使用div元素具有行内元素特点。

div{display:inline;}

行内元素特点:
1、和其他元素都在一行上;
2、元素的高度、宽度、行高及顶部和底部边距不可设置;
3、元素的宽度就是它包含的文字或图片的宽度,不可改变。

内联块状元素
内联块状元素(inline-block)就是同时具备内联元素、块状元素的特点代码display:inline-block就是将元素设置为内联块状元素。(css2.1新增),<img>、<input>标签就是这种内联块状标签。
inline-block元素特点:
1、和其他元素都在一行上;
2、元素的高度、宽度、行高以及顶和底边距都可设置

HTML标签的分类的更多相关文章

  1. HTML标签元素分类(HTML基础知识)

    HTML标签元素分类 一.按照块级元素还是行内元素分类 块级元素(block-level)和行内元素(inline-level,也叫作"内联"元素). a.块级元素(独占一行) 块 ...

  2. 【html】标签的分类

    一.标签的分类 1. 块状元素 :  独占一行, 宽高,行高,顶底部边距都可以进行设置 <div> <p> <h1-h6> <ol> <ul> ...

  3. 列表、margin和padding的探讨、标签的分类

    一.列表 列表分为无序列表.有序列表和自定义列表 1.无序列表   <ul></ul> 1).内部必须有子标签,<li></li> 2).ul天生自带内 ...

  4. NLP大赛冠军总结:300万知乎多标签文本分类任务(附深度学习源码)

    NLP大赛冠军总结:300万知乎多标签文本分类任务(附深度学习源码)       七月,酷暑难耐,认识的几位同学参加知乎看山杯,均取得不错的排名.当时天池AI医疗大赛初赛结束,官方正在为复赛进行平台调 ...

  5. NLP(二十八)多标签文本分类

      本文将会讲述如何实现多标签文本分类. 什么是多标签分类?   在分类问题中,我们已经接触过二分类和多分类问题了.所谓二(多)分类问题,指的是y值一共有两(多)个类别,每个样本的y值只能属于其中的一 ...

  6. 我的Android知识结构图——20200507停止更新,后续通过标签或分类继续完善结构图

    *持续更新中.调整中(带链接的是已经总结发布的,未带链接是待发布的) *个别知识点在多个分类中都是比较重要部分,为了分类完整性 可能多出都列出了 *每一篇都是认真总结并写出来的,若哪里有问题欢迎指正 ...

  7. html标签元素分类

    元素分类 html中的标签元素大体分为三种不同的类型:块状元素.内联元素(又叫行内元素)和内联块状元素. 常用的块状元素有: <div>.<p>.<h1>...&l ...

  8. Unit 3.标签的分类和嵌套规则

    一.标签分类 HTML中标签元素三种不同类型:块状元素,行内元素,行内块状元素. 常用的块状元素: <div> <p> <h1>~<h6> <ol ...

  9. Python 44 前端概述 、三剑客 、常用标签与分类

    1.前端三剑客是哪三位?文件的后缀内容?在前端开发中的功能是什么? HTML:   .htm .html   内容 CSS:   .css   效果 JS:   .js   行为 2.简述三剑客的主要 ...

  10. CSS html标签元素分类

    在CSS中,html中的标签元素大体被分为三种不同的类型: 块状元素.内联元素(又叫行内元素)和内联块状元素.  常用的块状元素有: <div>.<p>.<h1>… ...

随机推荐

  1. struts2的一些小问题

    1.action和ValueStack的关系2.ValueStack的类set()方法和setValue()方法的区别3.ValueStack的类push()方法的作用4.从ValueStack对象中 ...

  2. JDK安装以及配置环境变量的步骤

    ---恢复内容开始--- 一.JDK安装 JDK下载链接:https://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads ...

  3. YTU 2412: 帮警长数一数【循环、分支简单综合】

    2412: 帮警长数一数[循环.分支简单综合] 时间限制: 1 Sec  内存限制: 64 MB 提交: 323  解决: 169 题目描述 黑猫警长在犯罪现场发现了一些血迹,现已经委托检验机构确定了 ...

  4. YTU 2573: 连续奇数和

    2573: 连续奇数和 时间限制: 1 Sec  内存限制: 128 MB 提交: 63  解决: 37 题目描述 小明看到一本书上写着:任何数字的立方都可以表示为连续奇数的和. 比如: 2^3 = ...

  5. jQuery 与 AJAX 实现失去焦点验证用户名是否合格

    JSP页面 <tr onmouseover="currentcolor=this.style.backgroundColor;this.style.backgroundColor='# ...

  6. POI中HSSF和XSSF操作Excel

    POI中HSSF和XSSF操作Excel   在公司实习快一个月了,这段时间公司业务要用JAVA操作复杂的Excel报表.刚开始的Excel还好,没有涉及到复杂的图表,所以使用JXL操作Excel,但 ...

  7. kafka-net

    基于kafka-net实现的可以长链接的消息生产者 今天有点时间,我就来说两句.最近接触的Kafka相关的东西要多一些,其实以前也接触过,但是在项目使用中的经验不是很多.最近公司的项目里面使用了Kaf ...

  8. 关于python语言使用redis时,连接是否需要关闭的问题

    python操作完redis,需要关闭连接的吧,怎么关闭呢 1人赞 回复 君惜丶: redis-server会关闭空闲超时的连接redis.conf中可以设置超时时间:timeout 300 2017 ...

  9. 客户端与服务器持续同步解析(轮询,comet,WebSocket)

    在B/S模型的Web应用中,客户端常常需要保持和服务器的持续更新.这种对及时性要求比较高的应用比如:股票价格的查询,实时的商品价格,自动更新的twitter timeline以及基于浏览器的聊天系统( ...

  10. bzoj 4571 美味 —— 主席树

    题目:https://www.lydsy.com/JudgeOnline/problem.php?id=4571 区间找异或值最大,还带加法,可以用主席树: 可以按位考虑,然后通过加上之前已经有的答案 ...