在span的CSS中增加display属性,将span设置为block类型的Element,这样宽度的确有效了,但把前后文字隔在不同行里面,这样其实span就完全变成了div。
制作网站时发现给span设置宽度会无效,通过查阅CSS2标准中关于width 的定义发现,原来CSS中的 width 属性并不总是有效的,如果对象是 inline 对象,width 属性就会被忽略,Firefox 和 IE 是遵循CSS标准,因而直接设置span宽度会无效
一、初步解决span宽度方案
1、修改span为block类型,在span的css中增加display属性,将span设置为block类型。
span {
background-color:#fc0
display:block
width:150px
}
二、进一步解决span宽度方案
1、我们再增加一个css属性float
2、这样的确在某种条件下能解决问题。
span {
background-color:#fc0
display:block
float:left
width:150px
}
你这样定义span当然不可能居中显示了,你定义text-align:center,只是让span中的文字内容居中对其显示,并不是让span相对于div居中显示,如果要定义span居中,必须先让span成块级元素显示,也就是说,要先定义span的display:block属性,然后再给span添加边距属性margin:0px auto这样就能达到你想要的效果了。span的属性很多,几乎所有标签的属性都可以定义在span上,只是很多属性都必须在span成块级元素时菜其作用,span本身只是为了补充a标签的作用,是一个辅助标签,一般只能识别对文字的样式的你故意,所以如果想给span标签定义更多的其他样式属性,你就必须先给span加上块级属性,也就说添加display:block属性,这样以后你的样式就可以起作用了
因为外层有个div宽是99,span设置宽度99无效,只能删除span标签,在外层div上添加line-height及text-align样式了、
<div class="text_gray" style="height: 44pxwidth: 99pxborder:solid 1px #000line-height:44pxtext-align:center">岗 位</div><div class="pselect"></div>欢迎分享,转载请注明来源:内存溢出
评论列表(0条)