<div class="ui stackable grid"> 如何设置里面两个div 3 9分
时间: 2023-12-10 08:37:56 浏览: 20
可以使用 Semantic UI 的栅格系统来实现。栅格系统是一种用于创建响应式布局的技术,它将页面分成若干列,并允许您指定每个列的宽度。
以下是一个示例代码,可以实现将两个 div 分别设置为 3 和 9 的布局:
```html
<div class="ui stackable grid">
<div class="three wide column">
<!-- 这里放置左侧的 div 内容 -->
</div>
<div class="nine wide column">
<!-- 这里放置右侧的 div 内容 -->
</div>
</div>
```
在上面的代码中,`.ui.stackable.grid` 表示使用栅格系统来布局,`.three.wide.column` 和 `.nine.wide.column` 分别表示左侧 div 和右侧 div 的宽度。
您可以根据需要更改这些类的名称和宽度,以适应您的布局需求。
相关问题
如何设置 <div class="ui inverted secondary stackable menu"style="height: 40px;"> 在 <div class="ui container"> 里面居中
可以使用flex布局来实现。
首先,在`<div class="ui container">`里添加一个父元素,比如一个`<div>`标签,设置其样式为:
```
display: flex;
justify-content: center;
align-items: center;
```
然后,将`<div class="ui inverted secondary stackable menu"style="height: 40px;">`放入这个父元素里面,即可实现在`<div class="ui container">`里面居中。
完整代码示例:
```
<div style="display: flex; justify-content: center; align-items: center;">
<div class="ui inverted secondary stackable menu" style="height: 40px;"></div>
</div>
```
<div class="ui inverted secondary stackable menu"> 如何设置这个div 小一点
可以尝试修改该div的样式,如下所示:
```html
<div class="ui inverted secondary stackable menu" style="height: 50px;">
...
</div>
```
你可以通过修改 `height` 的值来调整该div的高度,从而达到缩小的效果。