Home > Article > Web Front-end > How to right align the p tag in the following html code
How to make the p tag in the following html code right-aligned
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <style type="text/css"> #t1{ background-color:#f8f8f8; border-bottom:1px solid #e6e6e6; height:24px; } #t1 p{ width:900px; margin:0px auto; padding-top:5px; float:right; font-size:12px; } #t1 p a{text-decoration:none;color:#738197;} </style> </head> <body> <div id="t1"><p style="color:#0CC"> <a href="http://pc.qq.com/">苹果</a> · <a href="http://www.qq.com/">鸭梨</a> · <a href="http://im.qq.com/">鸡蛋</a> · <a href="http://im.qq.com/mobileqq/">白菜 </a> </p> </div> </body> </html>
The width of the center is 900px
#t1 p{ width:900px; margin:0px auto; padding-top:5px; font-size:12px; overflow:hidden; text-align:right; }
Just remove the right floating of the p tag and change the text alignment to right.
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <style type="text/css"> #t1{ background-color:#f8f8f8; border-bottom:1px solid #e6e6e6; height:24px; } #t1 p{ width:900px; margin:0px auto; padding-top:5px; float:right; font-size:12px; } #t1 p a{text-decoration:none;color:#738197;} </style> <div id="t1"> <p style="color: rgb(0, 204, 204); text-align: right;"> <a href="http://pc.qq.com/">苹果</a> · <a href="http://www.qq.com/">鸭梨</a> · <a href="http://im.qq.com/">鸡蛋</a> · <a href="http://im.qq.com/mobileqq/">白菜 </a> </p> </div>
##
The above is the detailed content of How to right align the p tag in the following html code. For more information, please follow other related articles on the PHP Chinese website!