慕課CSS第七章是關于CSS之盒模型的內容,涉及到了盒子的寬高、內外邊距等等。
1. 盒模型有哪些組成部分? 盒模型由內容(content)、內邊距(padding)、邊框(border)和外邊距(margin)四個部分組成。 2. box-sizing屬性的作用是什么? box-sizing屬性用于設置盒子的大小計算方式。默認值為content-box,即當設置一個元素的寬高時,只包括元素的內容,不包括內外邊距和邊框。 如果設置為border-box,那么元素的寬高將包括內外邊距和邊框。 3. 盒子的寬高如何計算? 盒子的寬高是由內容區域(content)和內邊距(padding)、邊框(border)及外邊距(margin)組成的。當設置寬高時,需要考慮這些屬性的值。 例如:一個元素的寬度為100px,邊框為1px,內邊距為10px,外邊距為5px,則元素的總寬度為100+2*1+2*10+2*5=142px。 4. CSS如何設置內外邊距和邊框? 內外邊距和邊框都可以使用 CSS 中的 margin 和 padding 屬性進行設置,border 屬性用于設置邊框。例如: div { padding: 10px; margin: 5px; border: 1px solid grey; }
總之,掌握盒模型對于設計網頁布局有著至關重要的作用,學好這一章是我們做好前端工作的基礎。
上一篇所有兄弟選擇器css
下一篇手把手玩css