设有如下代码: <diy class="row"> <div class="">元素1</div> <div class="">无素2</div> <div class="">元素3</div> <div class="">元素4</div> </div> 如要其中的元素在小型屏幕显示时每行均兮为2 等份,在大型屏幕显示时每行均分为4等份,则 元素的class应设置为()。
时间: 2023-08-14 07:32:22 浏览: 99
div+css table布局实现代码
为了在小型屏幕上将元素均分为2份,并在大型屏幕上将元素均分为4份,可以为每个元素添加以下类:
在小型屏幕上:`.col-6`,表示每个元素占据12个网格系统中的6个网格,即占据屏幕宽度的1/2。
在大型屏幕上:`.col-lg-3`,表示每个元素占据12个网格系统中的3个网格,即占据屏幕宽度的1/4。
因此,元素的class应设置为:
```
<div class="row">
<div class="col-6 col-lg-3">元素1</div>
<div class="col-6 col-lg-3">元素2</div>
<div class="col-6 col-lg-3">元素3</div>
<div class="col-6 col-lg-3">元素4</div>
</div>
```
阅读全文