亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

搜索

在html中float不屬于盒子屬性嗎

青燈夜游
發(fā)布: 2021-03-02 17:34:12
原創(chuàng)
2327人瀏覽過
是的,float不屬于盒子屬性。盒子屬性有:width、height、padding、padding-bottom、padding-left、padding-right、padding-top、margin、border等等。

在html中float不屬于盒子屬性嗎

本教程操作環(huán)境:windows7系統(tǒng)、CSS3&&HTML5版、Dell G3電腦。

盒子模式(模型)就是在網(wǎng)頁(yè)設(shè)計(jì)中經(jīng)常用到的CSS技術(shù)所使用的一種思維模型。CSS假定所有的HTML文檔元素都生成一個(gè)描述該元素在HTML文檔布局中所占空間的矩形元素框,可以形象地將其看作是一個(gè)盒子。

通過定義一系列與盒子相關(guān)的屬性,可極大地豐富和促進(jìn)各個(gè)盒子乃至整個(gè)HTML文檔的表現(xiàn)效果和布局結(jié)構(gòu)。

css盒子模式(模型)又稱為框模型 (Box Model) ,是由元素內(nèi)容(content)、內(nèi)邊距(padding)、邊框(border)、外邊距(margin)幾個(gè)要素組成的(如下圖所示)。

立即學(xué)習(xí)前端免費(fèi)學(xué)習(xí)筆記(深入)”;

這些屬性我們可以把它轉(zhuǎn)移到我們?nèi)粘I钪械暮凶樱ㄏ渥樱┥蟻砝斫?,日常生活中所見的盒子也就是能裝東西的一種箱子,也具有這些屬性,所以叫它盒子模式。

1.png

盒子模型(Flexible Box) 屬性

1. 內(nèi)容區(qū)域設(shè)定(content):

  • width:寬度的設(shè)定
  • height:高度的設(shè)定

寬度和高度的設(shè)定可以是具體的數(shù)值(帶單位),也可以是百分比設(shè)置。

百度文心百中
百度文心百中

百度大模型語義搜索體驗(yàn)中心

百度文心百中22
查看詳情 百度文心百中

2. 內(nèi)邊距(padding)的設(shè)定:

  • 盒子的內(nèi)邊距分為上右下左四個(gè)方向
  • 內(nèi)邊距的設(shè)定用來控制盒子中裝載的內(nèi)容到盒子邊緣(邊框)之間距離。
  • 盒子的內(nèi)邊距占據(jù)的是盒子里面的空間,最小為0,不允許出現(xiàn)負(fù)值。
屬性 說明
padding 使用簡(jiǎn)寫屬性設(shè)置在一個(gè)聲明中的所有填充屬性
padding-bottom 設(shè)置元素的底部填充
padding-left 設(shè)置元素的左部填充
padding-right 設(shè)置元素的右部填充
padding-top 設(shè)置元素的頂部填充

(學(xué)習(xí)視頻分享:css視頻教程

3. 外邊距(margin)的設(shè)定

  • 盒子的外邊距分為上右下左四個(gè)方向
  • 外邊距的設(shè)定用來控制盒子外圍四周的距離,不屬于盒子本身范疇
  • 外邊距的主要用途是控制盒子的位置,所以可以出現(xiàn)負(fù)值
屬性 描述
margin 簡(jiǎn)寫屬性。在一個(gè)聲明中設(shè)置所有外邊距屬性。
margin-bottom 設(shè)置元素的下外邊距。
margin-left 設(shè)置元素的左外邊距。
margin-right 設(shè)置元素的右外邊距。
margin-top 設(shè)置元素的上外邊距。

4. 邊框(border)的設(shè)定

  • 大部分的元素對(duì)象在默認(rèn)情況下是沒有邊框的

  • 要設(shè)定邊框,必須同時(shí)設(shè)定3個(gè)要素:寬度、樣式和色彩。

  • border 復(fù)合屬性
  • 邊框按屬性要素分類的擴(kuò)展屬性(border-width:邊框?qū)挾?;border-style:邊框樣式;border-color:邊框色彩)

屬性 描述
border 簡(jiǎn)寫屬性,用于把針對(duì)四個(gè)邊的屬性設(shè)置在一個(gè)聲明。
border-style 用于設(shè)置元素所有邊框的樣式,或者單獨(dú)地為各邊設(shè)置邊框樣式。
border-width 簡(jiǎn)寫屬性,用于為元素的所有邊框設(shè)置寬度,或者單獨(dú)地為各邊邊框設(shè)置寬度。
border-color 簡(jiǎn)寫屬性,設(shè)置元素的所有邊框中可見部分的顏色,或?yàn)?4 個(gè)邊分別設(shè)置顏色。
border-bottom 簡(jiǎn)寫屬性,用于把下邊框的所有屬性設(shè)置到一個(gè)聲明中。
border-bottom-color 設(shè)置元素的下邊框的顏色。
border-bottom-style 設(shè)置元素的下邊框的樣式。
border-bottom-width 設(shè)置元素的下邊框的寬度。
border-left 簡(jiǎn)寫屬性,用于把左邊框的所有屬性設(shè)置到一個(gè)聲明中。
border-left-color 設(shè)置元素的左邊框的顏色。
border-left-style 設(shè)置元素的左邊框的樣式。
border-left-width 設(shè)置元素的左邊框的寬度。
border-right 簡(jiǎn)寫屬性,用于把右邊框的所有屬性設(shè)置到一個(gè)聲明中。
border-right-color 設(shè)置元素的右邊框的顏色。
border-right-style 設(shè)置元素的右邊框的樣式。
border-right-width 設(shè)置元素的右邊框的寬度。
border-top 簡(jiǎn)寫屬性,用于把上邊框的所有屬性設(shè)置到一個(gè)聲明中。
border-top-color 設(shè)置元素的上邊框的顏色。
border-top-style 設(shè)置元素的上邊框的樣式。
border-top-width 設(shè)置元素的上邊框的寬度。

更多編程相關(guān)知識(shí),請(qǐng)?jiān)L問:編程視頻!!

以上就是在html中float不屬于盒子屬性嗎的詳細(xì)內(nèi)容,更多請(qǐng)關(guān)注php中文網(wǎng)其它相關(guān)文章!

HTML速學(xué)教程(入門課程)
HTML速學(xué)教程(入門課程)

HTML怎么學(xué)習(xí)?HTML怎么入門?HTML在哪學(xué)?HTML怎么學(xué)才快?不用擔(dān)心,這里為大家提供了HTML速學(xué)教程(入門課程),有需要的小伙伴保存下載就能學(xué)習(xí)啦!

下載
來源:php中文網(wǎng)
本文內(nèi)容由網(wǎng)友自發(fā)貢獻(xiàn),版權(quán)歸原作者所有,本站不承擔(dān)相應(yīng)法律責(zé)任。如您發(fā)現(xiàn)有涉嫌抄襲侵權(quán)的內(nèi)容,請(qǐng)聯(lián)系admin@php.cn
最新問題
開源免費(fèi)商場(chǎng)系統(tǒng)廣告
最新下載
更多>
網(wǎng)站特效
網(wǎng)站源碼
網(wǎng)站素材
前端模板
關(guān)于我們 免責(zé)申明 意見反饋 講師合作 廣告合作 最新更新
php中文網(wǎng):公益在線php培訓(xùn),幫助PHP學(xué)習(xí)者快速成長(zhǎng)!
關(guān)注服務(wù)號(hào) 技術(shù)交流群
PHP中文網(wǎng)訂閱號(hào)
每天精選資源文章推送
PHP中文網(wǎng)APP
隨時(shí)隨地碎片化學(xué)習(xí)
PHP中文網(wǎng)抖音號(hào)
發(fā)現(xiàn)有趣的

Copyright 2014-2025 http://ipnx.cn/ All Rights Reserved | php.cn | 湘ICP備2023035733號(hào)