通过css中的text-align属性和line-height属性可以设置div内的文字上下左右居中显示 。 下面小编举例讲解一个DIV里面的文字如何上下左右居中显示 。
文章插图
需要这些哦
html+css
代码编纂器：Dreamweaver CS5
方式/
1新建一个html文件，定名为test.html，用于讲解一个DIV里面的文字若何上下摆布居中显示 。
文章插图
2在test.html文件内，利用div标签建立一行文字，文字内容为“这是测试的文字” 。
文章插图
3在test.html文件内，设置div的id属性为mycss，本家儿要用于下面经由过程该id来设置css样式 。
文章插图
4在test.html文件内，编写<style type="text/css"></style>标签，页面的css样式将写在该标签内 。
文章插图
5在css标签中，经由过程id（mycss）设置div的样式，利用width属性设置div的宽度为280px，利用height属性设置div的高度为180px，同时，利用background属性设置div的布景颜色为灰色 。
文章插图
6在css标签中，将text-align属性设置为center，实现文字的程度居中，将line-height属性设置为180px(与height的高度相等)，实现文字的垂直居中 。
文章插图
7在浏览器打开test.html文件，查看实现的结果 。
文章插图
总结：1【一个DIV里面的文字如何上下左右居中显示】1、建立一个test.html文件 。
2、在文件内，利用div标签建立一行文字 。
3、在css标签中，经由过程id（mycss）设置div的样式，利用width属性设置div的宽度为280px，利用height属性设置div的高度为180px 。
4、在css标签中，将text-align属性设置为center，实现文字的程度居中，将line-height属性设置为180px(与height的高度相等)，实现文字的垂直居中 。
注重事项line-height的高度值必需与div的高度值相等 。
以上内容就是一个DIV里面的文字如何上下左右居中显示的内容啦，希望对你有所帮助哦！
推荐阅读
- JavaScript中如何截取字符串的第一个字符
- 初恋是什么感觉！
- 如何应对半夜被蚊子咬醒
- QQ运动怎么提现？
- 天津去哪里看海
- 魔兽铁砧怎么获得
- 水缸怎么养莲藕
- 风姿曼妙下午茶
- 我的世界如何制作一个2乘2的房子
- 狮弹跳力、奔跑能力为何比老虎差好几个档次呢？猫科里能力最差就是狮吗？ 为什么猫咪那么灵活反应这么快弹跳力很强？