CSS:Table

日期:2021-03-06 类型:科技新闻 

关键词:上线了小程序官网,年会抽奖小程序免费,做小程序,小程序网站,跑腿小程序

从前在网页页面合理布局的情况下,table被很多的应用,在其中1个益处就是元素能够轻轻松松的精准定位,不容易出現甚么窜行的难题。你如果用div的话,1会inline1会float很是蛮烦。如何才可以在应用div的情况下也能享有的table精准定位的益处呢?下面举个事例:

拷贝编码
编码以下:

<!--HTML --!>
<div id="parent">
<div id="c1"></div>
<div id="c2"></div>
</div>

1个父器皿,装有两个子器皿,在c1宽度不确定性的状况下,怎样让c2填填满父器皿呢?能够这样:

拷贝编码
编码以下:

<span style="white-space:pre"> </span>#parent{
width: 90%;
margin: 50px auto;
border: #333333 solid 1px;
padding: 10px;
display: table;
}
#c1{
height: 50px;
background: #f30;
width: 35%;
display: table-cell;
}
#c2{
height: 50px;
background: #03f;
display: table-cell;
}

将父器皿的display特定为table,这样访问器便会把parent作为1个table对待,随后向table中加上元素,元素具备的实际效果就会和立即应用td标识1样。

实际效果图: