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. 磁盘扩容 磁盘阵列(Redundant Arrays of Independent Disks,RAID)

    磁盘阵列(Redundant Arrays of Independent Disks,RAID) 云 500G  不够用 扩容 方案1  重建分区,由500G到1T,按历史增速,1年后再扩到1.5T, ...

  2. Knn算法C++实现

    相对简单的模拟.C++11 /* *********************************************** Author :guanjun Created Time :2016/ ...

  3. 记一次部署java项目的问题

    项目里面有自动化任务, tomcat 错误信息 Table 'xxx.QRTZ_TRIGGERS' doesn't exist 提示在mysql中找不到这个表. 但mysql中确实存在,但名字是:qr ...

  4. 区块链共识算法 PBFT(拜占庭容错)、PAXOS、RAFT简述

    共识算法 区块链中最重要的便是共识算法,比特币使用的是POS(Proof of Work,工作量证明),以太币使用的是POS(Proof of Stake,股权证明)使得算理便的不怎么重要了,而今PO ...

  5. BZOJ_1307_玩具_单调栈+双指针

    BZOJ_1307_玩具_单调栈+双指针 Description 小球球是个可爱的孩子,他喜欢玩具,另外小球球有个大大的柜子,里面放满了玩具,由于柜子太高了,每天小球球都会让妈妈从柜子上拿一些玩具放在 ...

  6. bzoj3626 [LNOI2014]LCA——树链剖分

    题目:https://www.lydsy.com/JudgeOnline/problem.php?id=3626 思路很巧妙,把区间换成前缀和相减: 把 l ~ r 到根路径上的点的点权都+1,然后 ...

  7. Image2Caption

    定义 图像标注或语言生成图像问题把计算机视觉与自然语言处理联系在了一起,是广义的人工智能领域的一大难题.通常涉及到特征提取(用cnn提取出图像内部不为人类感知的向量特征)和语言模型建立.为图像提取文字 ...

  8. ubuntu/linuxmint搜狗输入法无法输入中文或崩溃

    执行下列命令: cd ~/.config rm -rf SogouPY SogouPY.users sogou-qimpanel 然后重启电脑.

  9. Extjs 3 Grid相关操作

    extjs gridpanel 操作行 得到选中行的列   var model = grid.getSelectionModel();   model.selectAll(); //选择所有行 mod ...

  10. [App Store Connect帮助]七、在 App Store 上发行(2.5)设定价格与销售范围:向企业或教育机构分发您的 App

    您可以向您添加至 App Store Connect 以及参与“Apple 商务”或“校园教务管理”的用户.企业或教育机构单独分发您的非公开 App.此选项仅在您的 App 尚未获得批准时可用. 有关 ...