CSS:如何针对居中文本对文本进行右对齐?(CSS: How can I right-justify text against centered text?)
给出以下HTML:
<div class="css_class_1"> <div class="css_class_2"> A 1 A 1 A 1 </div> <div class="css_class_3"> B 2 B 2 </div> </div>我想将文本A 1 A 1 A 1水平居中。 我想使文本B 2 B 2右对齐,使其右边界与A 1 A 1 A 1的右边界对齐。
我该怎么做? 请显示我应该为上述三个类中的每一个定义的css。
Given the following HTML:
<div class="css_class_1"> <div class="css_class_2"> A 1 A 1 A 1 </div> <div class="css_class_3"> B 2 B 2 </div> </div>I would like to make the text A 1 A 1 A 1 horizontally-centered. And I would like to make the text B 2 B 2 right-justified so that it's right border is aligned with the right border of A 1 A 1 A 1.
How can I do it? Please show the css I should define for each of the three mentioned classes.
最满意答案
将右边的文本置于中心位置:
.css_class_1 { background: green; padding: 10px; } .css_class_2 { background: yellow; text-align: center; display: inline-block; } .css_class_3 { background: red; text-align: right; }<div class="css_class_1"> <div class="css_class_2"> A 1 A 1 A 1 <div class="css_class_3"> B 2 B 2 </div> </div> </div>Put your right justify text inside the center one:
.css_class_1 { background: green; padding: 10px; } .css_class_2 { background: yellow; text-align: center; display: inline-block; } .css_class_3 { background: red; text-align: right; }<div class="css_class_1"> <div class="css_class_2"> A 1 A 1 A 1 <div class="css_class_3"> B 2 B 2 </div> </div> </div>
更多推荐
发布评论