如何使用DIV+css 实现文字横排居中 并且有间距

html-css06

如何使用DIV+css 实现文字横排居中 并且有间距,第1张

使用DIV+css 实现文字横排居中 并且有间距,首先文字需要有个块级元素包裹着,然后设定一定的宽度和高度,文字居中,css中有个text-align这个属性,设置成center,文字就是相对容器的宽度是居中的,请看代码:

<html>

<head>

<style>

#div1{

width:600px

height:40px

font-size:13px

}

#div1 p{

display:block

width:300px

height:30px

text-align:center

margin:0 auto

}

</head>

<body>

<div id='div1'>

<p>我是测试文字</p>

</div>

</body>

</html>

#tip前面加个a(a#tip),穿着裤子放屁,多此一举

你这个要直接a:hover span时设为block

<ul id="test">

<li><a href="#">移到这里<span>提示内容</span></a></li>

<ul>

#test a span{display:none}

#test a:hover span{display:block}

IE6下a:hover span是无效的,不过很好解决,你自行百度下ie6 a:hover span

1.一般情况,默认的div是写一个换一行,所以每一个div都是新的一行,div默认的display属性是block,把display换成inline就不会换新行了

<div

style="display:inline">XXX</div>

<div

style="display:inline">XXXX</div>

2.使用float:right属性。float做为CSS中的一个属性定义元素向哪个方向浮动。float:right 文本或图像会移至父元素中的右侧。 如下的代码,这里注意一下float属性必须配合width使用,不然的话float属性不起作用

<td class="bg10">

<div style="width:120px

float:right">阅读次数:9999</div>

<div style="width:200px

float:right">发表日期:2009-09-10</div>

</td>

.bg10

{

background-image:url(../images/news_r6_c4.jpg)

height:24px

line-height:24px

color:#939393

}