浮动元素具有行内块元素特点（HTML、CSS）

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>浮动元素具有行内块元素特点</title><style>/*     任何元素都可以浮动，不管原先是什么模式的元素，添加浮动之后具有行内块元素相似的特性 */span,div {float: left;width: 200px;height: 100px;margin-right: 2px;/* span为行内元素 没有宽和高，不能直接设置宽和高 */background-color: skyblue;/*  如果行内元素有了浮动，则不需要转换为块级/行内块元素 就可以直接设置高度和宽度 */}p {height: 200px;background-color: purple;}</style>
</head><body><span>1</span><span>2</span><div>div</div><p>p</p>
</body></html>

浮动元素具有行内块元素特点（HTML、CSS）相关推荐

【CSS】通过定位修改 display 显示模式 ( Display 显示模式转换 | inline-block 改块元素为行内块元素示例 | 为块元素设置浮动 | 为块元素设置定位 )
文章目录一.Display 显示模式转换二.块元素示例三.inline-block 改元素为行内块元素示例四.为块元素设置浮动五.为块元素设置定位一.Display 显示模式转换 disp ...
HTML元素分类：行内元素，块级元素，行内块元素；及其各自的特点
目录块级元素行内元素(内联元素) 行内块元素(内联块级元素) 一.块级元素(block) 定义:默认情况下,独占一行的元素就是块级元素. 特点: 每个块级元素独占一 ...
一文搞懂行内元素、块元素、行内块元素
文章目录前言一.了解各个元素的概念 1.概念: 2.举个例子: 3.样式展示二.如何将块元素变为行内块元素? 1.修改css中的dispaly属性 2.在进行样式选择的时候加入浮动三.将行内元 ...
块元素，行内元素，行内块元素及相互转换
块元素常见级特点: div 块 p 段落 ul li 有序列表 ol li 无序列表 dl dd dt 自定义列表 h1 大标题 h2 副标题 h3 3级标题 h4 4级标题 h ...
常见的块级元素、行内元素、行内块元素
一.块级元素 block 1. 特点: 自动换行独占一行可设置宽高默认宽度为父元素的宽度 2.常见块级元素 div.p.h1~h6.ul.ol.dl.li.dd.table.hr.blockqu ...
css标签显示特性（块级元素、行内元素、行内块元素、标签显示模式转换display、简单文字居中、简单导航栏案例）
HTML标签一般分为块标签和行内标签两种类型,它们也称块元素和行内元素. 标签以什么方式进行显示,比如div 自己占一行, 比如span 一行可以放很多个 1. 块级元素(block-level) 常 ...
php行内块,块级元素和行内块元素是什么？
在css基础当中,我们往往会遇到块元素和行内元素,块元素和行内元素也是很重要的基础知识,很多学生都感觉不重要,都不去学习,其实也是不正确的选择,下面我们来讲述一下块级元素和行内块元素是什么? 很多学生 ...
html 指定对象为块元素,html内联（行内）元素、块级（块状）元素和行内块元素分类...
HTML可以将元素分类方式分为内联(行内)元素.块级(块状)元素和行内块元素三种. 注:HTML是标签语言,那么既然是标签,就可以自己定义一些自己元素(如自定义的元素等),自定义元素浏览器默认解析为内 ...
css中标签显示模式、块元素、行内元素、行内块元素、显示模式转换
标签显示模式display: HTML标签一般分为块标签(块元素:block-level)和行内标签(行内元素:inline-level)两种类型,但是还有第三种说法行内块元素:table-row-g ...

浮动元素具有行内块元素特点（HTML、CSS）

浮动元素具有行内块元素特点（HTML、CSS）

浮动元素具有行内块元素特点（HTML、CSS）相关推荐

最新文章

热门文章