块元素

独占一行如h1-h6、p、div、ul、ol、li等；

宽高内外边距可以调；

宽度默认是父级宽度100%；

都是容器盒子，里面可以放行内或块级元素。

注意点：文字类元素如p、h1-h6里面不能放块元素div

行内元素

（也叫内联元素）一行可以放多个如 a、span、strong、b、em、i、del、s、ins、u等

相邻行内元素在一行上，一行可以显示多个；

宽高直接设置是无效的；

默认宽度就是本身内容宽度；

行内元素只能容纳文本或其他行内元素。

注意点：a里面不能放a，a里面可以放块级元素

行内元素为了照顾兼容性，尽量只设置左右内外边距（一行有多个行内元素情况下），不设置上下内外边距，因为设置了上下也不生效，除非转化为行内块或块级元素才可以。

行内块元素

同时具有块元素和行内元素的特点，如img、inptut、td

和相邻行内元素（行内块）在一行上，但是之间有空白缝隙。一行可以显示多个

默认宽度是本身内容宽度

高度、行高、内外边距都可以控制（块元素特点）

tip

把行内元素转换为块元素用 display:block;
把块元素转换为行内元素用 display:inline;
转换为行内块元素用 display:inline-block;

CSS之块、行内、行内块元素相关推荐

typora修改主题字体、代码块字体、行内块代码字体大小、引用块字体大小、代码块背景颜色、文章可写区域宽度以及修改教程
目录 0. 授人以渔 1.主题字体 2.代码块字体大小 3.引用块字体大小 4.代码块背景颜色 ①pink老师的样式代码 ②自己搜到的样式 5.块代码字体大小 6.修改文章可写区域的宽度 0. 授人以 ...
HTML 块标签，行内标签，行内块标签以及之间的相互转换
HTML标签分类行内标签:包含a.span.em.strong.b.i.u.label.br: 特点:可以多个标签存在一行,不能直接设置行内标签的高度.宽度.行高以及顶和底边距,完全靠内容撑开宽 ...
块级、行内元素水平垂直居中方法
块级.行内元素水平垂直居中方法块级元素水平垂直居中 // 为目标元素设置以下属性 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 ...
13 ，CSS 入门基础,行内排版内嵌式排版和外部排版样式
1.认识 CSS 2.传统 HTML 设计网页版面的缺点 3.CSS 的特点 4.CSS 的排版样式 13.1 认识CSS CSS的英文全名是 Cascading Style Sheets,中文可翻译 ...
CSS的引入方式：行内样式表（行内式）、内部样式表（嵌入式）、外部样式表（链接式）
文章目录 CSS引入方式内部样式表行内样式表外部样式表 CSS引入方式总结 CSS引入方式内部样式表内部样式表(内嵌样式表)是写到 html 页面内部.是将所有的CSS代码抽取出来,单独放到 ...
CSS3与页面布局学习笔记（二）——盒子模型(Box Model)、边距折叠、内联与块标签、CSSReset
一.盒子模型(Box Model) 盒子模型也有人称为框模型,HTML中的多数元素都会在浏览器中生成一个矩形的区域,每个区域包含四个组成部分,从外向内依次是:外边距(Margin).边框(Border ...
Box Model,边距折叠，内联和块标签，CSSReset
一.盒子模型(Box Model) 1.1.宽度测试 1.2.溢出测试 1.3.box-sizing属性 1.4.利用CSS画图二.边距折叠 2.1.概要 2.2.垂直方向外边距合并计算三.内联与 ...
CSS3与页面布局——Box Model、边距折叠、内联与块标签、CSSReset
一.盒子模型(Box Model) 盒子模型也有人称为框模型,HTML中的多数元素都会在浏览器中生成一个矩形的区域,每个区域包含四个组成部分,从外向内依次是:外边距(Margin).边框(Border ...

CSS之块、行内、行内块元素

块元素

行内元素

行内块元素

CSS之块、行内、行内块元素相关推荐

最新文章

热门文章

CSS之 块、行内、行内块元素

块元素

行内元素

行内块元素

CSS之 块、行内、行内块元素相关推荐

最新文章

热门文章

CSS之块、行内、行内块元素

CSS之块、行内、行内块元素相关推荐