[html&css] css实现两端对齐

实现效果

image.png

代码

// html
<div>
  <div class="label">姓名</div>
</div>
<div>
  <div class="label">出生日期</div>
</div>
<div>
  <div class="label">性别</div>
</div>
// css
.label {
  display: inline-block;
  width: 70px;
  background-color: #ddd;
  margin-top: 10px;
  text-align-last: justify;
}
最后编辑于 :
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 1.margin 负值的方式 该方法需要外面多嵌套一层来实现,通过元素的间距,做为中间层的 margin 溢出值来...
    二季猫Hsu阅读 2,898评论 0赞 2
  • 实现方法如下: 效果如下:
    Devid阅读 412评论 1赞 1
  • 今天我们来聊一聊CSS文本两端对齐。 事情的起因是这样的,在Review一位同事做的页面时,发现好几处字符之间写了...
    _乾_阅读 3,761评论 17赞 38
  • CSS实现文本两端对齐 我们在制作表单时经常遇到控件前的label标签中文本长度不一,有时候为了美观,我们会采取文...
    Homary阅读 549评论 0赞 2
  • 需求: 在表单填写或者姓名列表展示时,会出现文字字数不统一,导致文字长度不一的情况,但是又想要文字两端对齐的情况。...
    猫晓封浪阅读 496评论 0赞 0

友情链接更多精彩内容