但问题是,我怎么就看不到效果呢?无论是英文还是中文,在IE和chrome下都不起作用。后来,终于在StackOverflow上找到解决方法了。
从效果图可以看到,除了要在块级元素加text-align:justify样式外,还需要在里面加一个空的span元素,并应用样式。另外,对于中文还必须用空格隔开汉字,否则也没有两端对齐的效果。英文每个单词都有空格隔开,所以没问题。
但是加入HTML元素又违反了结构表现分离的原则,我们可以改用after、before伪元素:
参考资料: css实现文字两端对齐
需要准备的材料分别有:电脑、浏览器、html编辑器。
1、首先,打开html编辑器,新建html文件,例如:index.html。
2、在index.html中的<style>标签中,输入css代码:img{float:left}。
3、浏览器运行index.html页面,此时div标签中的左侧图片与右侧图片通过css调整为了浮动而顶部对齐了。
css设置水平居中,我们首先需要做的就是给这个div或者是表格一个width和height让他有具体的高宽显示,然后在通过margin来实现,margin的介绍,可以看图:
将margin设置成0 auto就成居中显示了,具体看代码:
<html>
<head>
<style>
tabel{
width:400px
height:300px
margin:0 auto
}
</style>
</head>
<body>
<table>
<tr>
<td>我是测试文字</td>
</tr>
</table>
</body>
</html>