html让元素纵向排列,html – 如何使元素排列到父元素的外边缘
生活随笔
收集整理的這篇文章主要介紹了
html让元素纵向排列,html – 如何使元素排列到父元素的外边缘
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
我建議你使用flex,這個
article是flex css的良好開端.
我做的是將內(nèi)容包裝到flex-div中,即body-container.然后我將該部分的flex-grow設(shè)置為2,并將nav設(shè)置為1.因此它將是1：2：1的比例
Webpage Layout* {
padding: 0px;
}
html {
width: 970px;
margin: auto;
}
.body-container {
display: flex;
}
header, footer {
text-align: center;
height: 10%;
margin: 5px;
border: 1px solid black;
}
section, nav, aside {
text-align: center;
margin: 5px;
border: 1px solid black;
}
section {
flex: 2 0 auto;
}
nav, aside {
flex: 1 0 auto;
}
Header
Aside
Section
Nav
總結(jié)
以上是生活随笔為你收集整理的html让元素纵向排列,html – 如何使元素排列到父元素的外边缘的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： android列表时间轴,Android
- 下一篇： 获取打印的html代码怎么写,javas