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

    用css实现div里面的文字靠右

    青灯夜游青灯夜游2021-02-22 15:58:40原创241

    在css中,可以通过给div元素添加“text-align: right;”样式来让div里面的文字靠右。text-align属性可以设置元素中的文本的水平对齐方式,当属性值设置为“right”时可以把文本排列到右边。

    本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。

    css实现div里面的文字靠右

    //文字右边对齐
    div{text-align: right;}

    text-align 属性规定元素中的文本的水平对齐方式。

    该属性通过指定行框与哪个点对齐,从而设置块级元素内文本的水平对齐方式。通过允许用户代理调整行内容中字母和字之间的间隔,可以支持值 justify;不同用户代理可能会得到不同的结果。

    描述
    left把文本排列到左边。默认值:由浏览器决定。
    right把文本排列到右边。
    center把文本排列到中间。
    justify实现两端对齐文本效果。

    【推荐教程:CSS视频教程

    示例:

    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="utf-8">
    		<style type="text/css">
    			div{
    				width: 500px;
    				padding: 10px;
    				background: palegoldenrod;
    			}
    			.box{
    				text-align: right;
    			}
    		</style>
    	</head>
    
    	<body>
    		<div>div中的测试文本--默认</div>
    		<div class="box">div中的测试文本--右边对齐</div>
    	</body>
    
    </html>

    效果图:

    1.png

    更多编程相关知识,请访问:编程视频!!

    以上就是用css实现div里面的文字靠右的详细内容,更多请关注php中文网其它相关文章!

    本文原创发布php中文网,转载请注明出处,感谢您的尊重!
    专题推荐:css
    上一篇:css文件一般叫什么 下一篇:css中能加减乘除吗
    第15期线上培训班

    相关文章推荐

    • 浅谈css布局中负margin的使用方法• css如何修改html标签的title样式?(代码示例)• 看看CSS中的那些背景图片函数!• CSS实现滚动阴影效果的小技巧(分享)

    全部评论我要评论

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

    PHP中文网