HTML元素分类：行内元素，块级元素，行内块元素；及其各自的特点
目录
- 块级元素
- 行内元素（内联元素）
- 行内块元素（内联块级元素）
一、块级元素（block）
定义：默认情况下，独占一行的元素就是块级元素。
特点：
- 每个块级元素独占一行（很霸道）
- 可以直接设置宽度、长度、行高、上下内外边距
- 元素在宽度不设置的情况下，继承父容器的宽度（高度不能继承）
常见的块级元素：
<div>,<p>,<h1~h6>,<ol>,<ul>,<dl>,<table>,<form>...
二、行内元素（内联元素）
定义：默认情况下，一行能显示多个，并且元素的高度、宽度、行高等不能直接设置
特点：
- 能够一行显示多个
- 元素的宽度、高度、顶部和底部内外边距不能直接设置
- 元素的宽度就是其内容的宽度
常见的行内元素：<a>,<span>,<br>,<i>,<em>...
三、行内块元素（内联块状元素）
定义：一行能显示多个，并且元素的宽度、高度等都可以设置的元素就叫行内块元素
特点：
- 一行能显示多个
- 元素的高度、宽度、行高、以及顶部底部的内外边距都可以设置
常见的行内块元素：<img>,<input>
这三种元素之间可以通过display属性相互转换，并且也可以通过浮动、定位等进行转换
后面本人会发专栏博客介绍浮动、定位的特点
HTML元素分类：行内元素，块级元素，行内块元素；及其各自的特点相关推荐
- 块级、行内元素水平垂直居中方法
块级.行内元素水平垂直居中方法 块级元素水平垂直居中 // 为目标元素设置以下属性 position: absolute; /*top: 0;*/ left: 0; right: 0; bottom: ...
- 行转换html,块级、行内、行内元素相互转换
块级.行内.行内元素相互转换 html> 块级.行内.行内块元素相互转换 *{margin: 0px;padding: 0px;} body{background: url(images/5.j ...
- CSS块级、行级、行级块标签、display、div、span
文章目录 块级标签 行级标签 行级块标签 display div 和span 块级标签 无论内容有多少,都会占据一行; 默认宽:与父级标签一致; 默认高:0 :或者与内容高度一致. 但是可以通过 wi ...
- block与inline，inline和inline-block，块级和行内元素，行内替换和行内非替换元素
block:块级元素默认display属性为block:无论块内内容有多少,总是占满一行: inline:行内元素默认display属性为inline:只占据块内的内容的大小,不会占满一整行: inl ...
- css元素显示模式（行内、块级、行内块）
1.块级元素 显示特点: 1.独占一行(一行只能显示一个) 2.宽度默认是父元素的宽度,高度默认由内容撑开 3.可以设置宽高 代表标签: div.p.h系列.ul.li.dl.dt.dd.form.h ...
- html5行级标签,8、html5哪些标签时块级、行内、行内块？2021-01-30
一.块级标签 div.p.h1-h6.form.ul.ol.dl.dt.dd.li.table.tr.td.th.hr.blockquote.address.table.menu.pre HTML5: ...
- 块级，行内（内联）对比笔记
块级元素: div, p, h1, h2, h3, h4, h5, h6, ul, li, ol, dl,pre,form, table等 行内元素: span, td, tr, a, img, in ...
- html如何更改子元素文字颜色,CSS更改父级悬停上的子元素字体颜色
我试图让它如此:当将鼠标悬停在td上时,跨度内部变为白色,并且td的背景变为蓝色.但是,没有一个类似的问题似乎对我有帮助.表例如CSS更改父级悬停上的子元素字体颜色 第一行: Account Hold ...
- javascript中变量没有块级作用域---函数内申明的变量在整个函数中都有效！
代码: var g = "a" function test() { alert(g); //输出"undefined",而不是"a&quo ...
- css变成块级元素_探讨行内元素转换为块级元素_html/css_WEB-ITnose
行内元素和块级元素对于前端来说是一个很重要的概念.在CSS中,只有块级元素有物理属性,而元素则有三种形态: 1. 块级元素:有物理属性,width,height写值起作用,而且要占据一行. 2. 行内 ...
最新文章
- DOS命令大全 黑客必知的DOS命令集合
- LeetCode刷题指南！
- ThinkPhp学习13
- 科大星云诗社动态20210429
- 20150309+Linux+LAMP安装-02
- 疯狂.NET架构通用权限后台管理工具演示版2.0下载
- 很大的.xls 文件导入sqlserver2005导入不全_python3 接口测试数据驱动之操作 excel 文件...
- POJ1182 食物链---(经典种类并查集)
- AutoCAD使用技巧
- Windows下打印服务器的管理（二）
- jQuery和$、jQuery(function(){})和(function(){})(jQuery)
- 怎么改掉科学计数法_宝宝口唇干裂怎么回事？该怎么办？
- java的维护_天了噜，Java 8 要停止维护了！
- Gentoo搭建PPTP服务器
- 西奥电梯服务器故障维修,电梯维保须知：西子奥的斯电梯故障分析及解决
- c语言句子后移两位加密,用C语言实现对输入的引英文句子进行加密
- 【学习笔记】欧拉筛法（线性筛素数）
- 支付宝查询自己UID
- 『原创』ewebeditor 2.1.6 上传漏洞利用工具
- Mysql-mmm高可用集群