设置元素为浮动后，display的值是多少？

1.为什么关注此问题？

行内元素设置为浮动后，可以设置宽高了，为什么？

我们知道Html元素分三种

块级元素（display:block）--> 可以设置元素的宽高

行内元素（display:inline）--> 默认不换行,设置width/height无效(可以设置line-height)，margin/padding上下无效

行内块级元素（display:inline-block ）--> 可以设置宽高的特性，同时又具有 inline 元素默认不换行的特性

实践出真知，动手吧！

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Document</title></head><style>.spn{border: 2px solid #000000;}.mydiv{border: 2px solid #000000;}#in{display: inline-block;border: 2px solid #005599;}</style><body><div class="page"><span class="spn">行内元素1</span><span class="spn">行内元素2</span><p id="in">行内块状元素1</p><p id="in">行内块状元素2</p><div class="mydiv" id="a">块状元素1</div><div class="mydiv" id="b">块状元素2</div></div>
</html>

效果图：

操作一：

设置行内元素浮动，查看display的值

设置前

设置后

操作二：

设置块级元素浮动，查看display的值

设置前

设置后

操作三：

设置块级行内元素浮动，查看display的值

设置前

设置后

结论：设置元素为浮动后，display的值是block

2.有什么意义？

以后在项目中如果需要设置行内元素的宽高，则设置为浮动后，就可以设置了

设置元素为浮动后，display的值是多少？相关推荐

CSS浮动-5.1浮动比较重要-使用folat属性来设置元素的浮动-left-right-none
为了满足html的多样化布局,我们就需要浮动来改变html元素默认的布局方式,使页面更加的美观. [标准流布局:默认布局,如,div默认从上到下,span默认从左到右,放不下了,就放到下一行] 1.什 ...
CSS day_04(6.15)背景颜色图片、修饰元素、浮动
一.背景颜色和背景图片 1.背景颜色 backgroud-color:#fff; 背景颜色会在元素的最底层颜色可以使用任何色值(十六进制 rgb rgba 单词) 一般这个值都需要我们重新设置 2. ...
[css] 当一个元素被设置为浮动后，它的display值变为什么呢？
[css] 当一个元素被设置为浮动后,它的display值变为什么呢? 一个元素被设为绝对定位或者浮动后,其display计算值就变为了block,尽管其表现形式和inline-block类似--包裹 ...
[html] 对一个元素设置浮动后，它的特征是什么？
[html] 对一个元素设置浮动后,它的特征是什么? 浮动元素脱离正常的文档流浮动元素后的内联元素,将围绕在浮动元素周围浮动元素会造成父元素的高度坍塌个人简介我是歌谣,欢迎和大家一起交流前后端知识 ...
HTML浮动导致高度塌陷,HTML 文档流，设置元素浮动，导致父元素高度无法自适应的解决方法（高度欺骗）...
元素浮动定义 float 属性定义元素在哪个方向浮动.以往这个属性总应用于图像,使文本围绕在图像周围,不过在 CSS 中,任何元素都可以浮动.浮动元素会生成一个块级框,而不论它本身是何种元素. 如果浮 ...
html自适应_web前端入门到实战：HTML 文档流，设置元素浮动，导致父元素高度无法自适应的解决方法...
元素浮动定义 float 属性定义元素在哪个方向浮动.以往这个属性总应用于图像,使文本围绕在图像周围,不过在 CSS 中,任何元素都可以浮动.浮动元素会生成一个块级框,而不论它本身是何种元素. 如果浮 ...
通过jQuery的slideToggle()方法实现元素的显示隐藏时，利用当前ul元素display的值判断状态遇到的问题
项目场景: 通过jQuery的slideToggle()方法实现元素的显示隐藏时,利用当前ul元素display的值判断状态,点击当前p标签时,显示隐藏兄弟元素ul,当ul显示时p为灰色,隐藏则p为蓝 ...
设置元素的宽和高元素的left和top 元素卷曲出去的值为元素绑定事件
设置元素的宽和高 <!DOCTYPE html> <html lang="en"> <head><meta charset="U ...
css浮动后页面乱了怎样解决,详解浮动元素引起的问题和解决办法
一.问题多个浮动的元素无法撑开父元素的宽度,父元素的高度可能会变成0. 若浮动元素后面跟非浮动元素,非浮动元素会紧随其后浮动起来. 若浮动元素前面还有同级元素没有浮动则会影响页面结构. 二.解决办法 ...

设置元素为浮动后，display的值是多少？

结论：设置元素为浮动后，display的值是block

设置元素为浮动后，display的值是多少？相关推荐

最新文章

热门文章

设置元素为浮动后，display的值是多少？

结论： 设置元素为浮动后，display的值是block

设置元素为浮动后，display的值是多少？相关推荐

最新文章

热门文章

结论：设置元素为浮动后，display的值是block