html里文字居中代码怎么写?
发布时间:09/01 来源:未知 浏览:
关键词:
文字水平居中
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>水平居中</title> <style> .box { width: 300px; height: 200px; background: palegoldenrod; text-align:center; } </style> </head> <body> <div class="box">水平居中了--文本文字</div> </body> </html>
结果图:
说明:text-align
text-align是一个根本的属性,它会影响一个元素中的文本行互相间的对齐方式。值left、right和center会致使元素中的文本离别左对齐、右对齐和居中,想要使文本居中,直接使用center即可。
该属性设定文本和img标签等一些内联对象(或与之相似的元素)的居中。
文字垂直居中
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>垂直居中</title> <style> .box { width: 300px; height: 300px; background: paleturquoise; line-height:300px; } </style> </head> <body> <div class="box">垂直居中了--文本文字</div> </body> </html>
结果图:
line-height 属性设定行间的间隔(行高)。不同意使用负值。
该属性会影响行框的规划。在利用到一个块级元素时,它定义了该元素中基线之间的最小间隔而不是最大间隔。
引荐教程:html教程
以上就是html里文字居中代码如何写?的具体内容,更多请关注百分百源码网其它相关文章!