中文字幕日韩精品一区二区免费_精品一区二区三区国产精品无卡在_国精品无码专区一区二区三区_国产αv三级中文在线

網(wǎng)站前端制作之displayflex布局

2023-03-26    分類: 網(wǎng)站建設(shè)

display:flex 是一種新布局方式,由W3C提出的,能夠以很少的樣式代碼完成以前需要很多樣式的布局,可以簡(jiǎn)便、完整、響應(yīng)式地實(shí)現(xiàn)各種頁(yè)面布局,兼容大部分瀏覽器,ie10開始支持,但是IE10的是-ms形式的。
display:flex有六個(gè)屬性,分別是:1.flex-direction;2.flex-wrap;3.flex-flow;4.justify-content;5.align-item;6.align-content。
第一個(gè):flex-direction屬性:決定主軸的方向(即項(xiàng)目的排列方向)。有4個(gè)屬性值:
row(默認(rèn)):主軸水平方向,起點(diǎn)在左端;row-reverse:主軸水平方向,起點(diǎn)在右端;column:主軸垂直方向,起點(diǎn)在上邊沿;column-reserve:主軸垂直方向,起點(diǎn)在下邊沿。
第二個(gè):flex-wrap屬性:定義換行情況。有3個(gè)屬性值:nowrap(默認(rèn)):不換行;wrap:換行,第一行在上方;wrap-reverse:換行,第一行在下方。
第三個(gè):flex-flow屬性:flex-direction和flex-wrap的簡(jiǎn)寫,默認(rèn)row nowrap。
第四個(gè):justify-content屬性:定義項(xiàng)目在主軸上的對(duì)齊方式。有多個(gè)屬性值,在這里介紹常用的幾個(gè)屬性值:flex-start(默認(rèn)值):左對(duì)齊;flex-end:右對(duì)齊;center:居中;space-between:兩端對(duì)齊,項(xiàng)目之間間隔相等;space-around:每個(gè)項(xiàng)目?jī)蓚?cè)的間隔相等,即項(xiàng)目之間的間隔比項(xiàng)目與邊框的間隔大一倍。
第五個(gè):align-items屬性:定義在交叉軸上的對(duì)齊方式。有5個(gè)屬性值:flex-start:起點(diǎn)對(duì)齊;flex-end:終點(diǎn)對(duì)齊;center:中點(diǎn)對(duì)齊;baseline:項(xiàng)目的第一行文字的基線對(duì)齊;stretch(默認(rèn)值):如果項(xiàng)目未設(shè)置高度或設(shè)為auto,將占滿整個(gè)容器的高度。

新聞名稱:網(wǎng)站前端制作之displayflex布局
網(wǎng)站路徑:http://m.rwnh.cn/news19/247869.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站設(shè)計(jì)公司、移動(dòng)網(wǎng)站建設(shè)做網(wǎng)站、自適應(yīng)網(wǎng)站、網(wǎng)頁(yè)設(shè)計(jì)公司手機(jī)網(wǎng)站建設(shè)

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)

小程序開發(fā)
信丰县| 沁水县| 商水县| 大洼县| 阿图什市| 漠河县| 丹阳市| 封丘县| 天台县| 河北省| 商南县| 普兰县| 博爱县| 遂川县| 南雄市| 奇台县| 应城市| 九寨沟县| 安顺市| 时尚| 吉林省| 扎兰屯市| 云浮市| 武胜县| 天长市| 含山县| 上栗县| 如皋市| 元谋县| 类乌齐县| 稻城县| 阳山县| 高雄县| 嘉善县| 西乡县| 陕西省| 图们市| 克拉玛依市| 沐川县| 双鸭山市| 天柱县|