欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

为span标签添加样式_html/css_WEB-ITnose

程序员文章站 2024-04-03 08:24:52
...










请问各位朋友,为什么我为span元素添加的背景样式显示的宽度不是250px呢?而只是span标签中的字的背后区域才显示背景颜色呢?希望各位给予帮助,不胜感激!先谢谢了!


回复讨论(解决方案)

span不是块级元素,设置width无效

span是内联元素,高宽度是由其内容来决定的


.has_children span{background:red;width:250px;}
改成这样
.has_children span{display:block;background:red;width:250px;}

div占用的位置是一行,span占用的是内容有多宽就占用多宽的空间距离

该说的都说了。

2楼正解 display:block 加上这个

2楼正解

display:block 加上这个

.has_children span{background:red;width:250px; display:inline-block}

楼上正解

.has_children span{background:red;width:250px;display:inline-block}
IE下块元素如何实现display:inline-block的效果?
有两种方法:
1、先使用display:inline-block属性触发块元素,然后再定义display:inline,让块元素呈递为内联对象(两个display要先后放在两个CSS声明中才有效果,这是IE的一个经典bug,如果先定义了display:inline-block,然后再将display设回inline或block,layout不会消失)。代码如下(...为省略的其他属性内容):
div {display:inline-block;...}
div {display:inline;}

2、直接让块元素设置为内联对象呈递(设置属性display:inline),然后触发块元素的layout(如:zoom:1等)。代码如下:
div {display:inline; zoom:1;...}


谢谢各位的解答!