Css—display:table-cell的几种应用
source link: http://www.hywel.cn/2020/10/16/css-displaytable-cell%E7%9A%84%E5%87%A0%E7%A7%8D%E5%BA%94%E7%94%A8/
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
Css—display:table-cell的几种应用
Posted on
2020-10-16 In Web前端
TableCell 对象代表一个 HTML 表格单元格。 在一个 HTML 文档中 标签每出现一次,一个 TableCell 对象就会被创建。
元素两端对齐
.container{
display: table;
border: 1px solid #06c;
padding: 15px 5px;
max-width: 1000px;
margin: 10px auto;
min-width: 320px;
width: 100%;
}
.container_box {
width: 10px;
height: 10px;
background:#000;
text-align: center;
display: inline-block;
font-size: 40px;
line-height: 100px;
}
.container_right {
text-align: right;
display: table-cell
}
.container_left {
text-align: left;
display: table-cell
}
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK