• 技术文章 >web前端 >css教程

    css文字居中怎么打

    anonymityanonymity2019-05-28 15:23:41原创9941
    CSS text-align

    text-align语法:

    text-align : left | right | center | justify

    text-align参数值与说明:

    left : 左对齐

    right : 右对齐

    center : 居中

    *justify : 两端对齐(不推荐使用,通常大部分浏览器不使用)

    我们对text-align常用的参数值为left、right、center

    text-align功能说明:

    设置或检索对象中文本的左中右对齐方式。

    案例示范:

    我们设置3个盒子,分别都设置盒子CSS高度、CSS宽度相同,再分别设置三个盒子里内容靠左对齐、居中对齐、靠右对齐。

    我们都设置3个盒子高度为50px;宽度为300px;便于观察我们设置3个盒子都1个黑色边框样式。

    1、HTML+CSS代码

    1)、CSS代码

    .div1{ width:300px; height:50px; border:1px solid #000; text-align:left} 
    .div2{ width:300px; height:50px; border:1px solid #000; text-align:center} 
    .div3{ width:300px; height:50px; border:1px solid #000; text-align:right} 
    /*  
    div1 div2 div3 分别设置 靠左 居中 靠右对齐 
    */

    2)、HTML代码

    <div class="div1">我被靠左对齐</div> 
    <div class="div2">我被居中显示</div> 
    <div class="div3">我被靠右对齐</div>

    以上就是css文字居中怎么打的详细内容,更多请关注php中文网其它相关文章!

    声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理
    专题推荐:css
    上一篇:css怎么改变div的位置 下一篇:css max-height属性怎么用
    大前端线上培训班

    相关文章推荐

    • css怎么设置字体立体• css怎么把纵向排列变成横向• css border-right-width属性怎么用• css怎么绘制斜线• dw怎么用css做图片轮播

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网