国产一区二区精品-国产一区二区精品久-国产一区二区精品久久-国产一区二区精品久久91-免费毛片播放-免费毛片基地

千鋒教育-做有情懷、有良心、有品質(zhì)的職業(yè)教育機(jī)構(gòu)

手機(jī)站
千鋒教育

千鋒學(xué)習(xí)站 | 隨時(shí)隨地免費(fèi)學(xué)

千鋒教育

掃一掃進(jìn)入千鋒手機(jī)站

領(lǐng)取全套視頻
千鋒教育

關(guān)注千鋒學(xué)習(xí)站小程序
隨時(shí)隨地免費(fèi)學(xué)習(xí)課程

當(dāng)前位置:首頁  >  技術(shù)干貨  > web前端面試題合集(九)

web前端面試題合集(九)

來源:千鋒教育
發(fā)布人:wjy
時(shí)間: 2022-09-06 15:46:42 1662450402

  實(shí)現(xiàn)垂直居中的幾種方法,不知道寬高的情況下如何實(shí)現(xiàn)元素水平垂直居中?

  - **實(shí)現(xiàn)垂直居中的幾種方式**:

  - 1.單行文本垂直居中:當(dāng)此標(biāo)簽高度和行高的值相等時(shí);

  - 2.定位: 父元素{position:relative;} 子元素{position:absolute;top:50%;margin-top:-高度的一半;}

  - 3.定位: 父元素{position:relative;} 子元素{position:absolute;top:0;bottom:0;margin:auto;}

  - 4.定位: 父元素{position:relative;} 子元素{position:absolute;top:50%;transform:translateY(-50%);}

  - 5.彈性盒:父元素{display:flex;align-items:center;}

  - **不知道寬高的情況下如何實(shí)現(xiàn)元素水平垂直居中**:

  - 1.定位: 父元素{position:relative;}

   子元素{position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;}

  - 2.定位: 父元素{position:relative;}

   子元素{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);}

  - 3.彈性盒: 父元素{display:flex;} 子元素{margin:auto;}

  - 4.彈性盒: 父元素{display:flex;justify-content:center;align-items:center;}

 

web前端面試題

  談?wù)刦lex布局,你知道flex:110嗎

  - flex布局:彈性盒布局(形成彈性盒后可以控制子元素在父級(jí)元素中排列位置)

  - flex:1 1 0 是由 flex-grow:1 flex-shrink:1 flex-basis:0復(fù)合而成 也可以簡(jiǎn)寫為flex:1

  表示占據(jù)主軸上剩下的空間 當(dāng)子級(jí)內(nèi)容超出的時(shí)候會(huì)將當(dāng)前區(qū)域撐大

  - flex-grow默認(rèn)值為0,當(dāng)值大于0時(shí),當(dāng)父元素有剩余空間時(shí)當(dāng)前元素放大,父元素沒有剩余空間時(shí),該元素不放大。

  - flex-shrnk默認(rèn)值為1,父元素有剩余空間時(shí),該元素不縮小,父元素沒有剩余空間時(shí),該元素縮小。

  - **flex-basis**相當(dāng)于width屬性。

 

  談一下怎么實(shí)現(xiàn)一個(gè)橢圓,使用css

  · 使用border-radius屬性 屬性值可以設(shè)置一個(gè)/兩個(gè)/三個(gè)/四個(gè)/八個(gè) 以下是兩種方法實(shí)現(xiàn)橢圓

  o 第一種: width: 250px; height: 150px;background: #FFD900;border-radius: 50%

  o 第二種: width: 250px; height: 150px;background: #FFD900;border-radius: 50% / 100% 100% 0 0;

 

  脫離布局流有幾種方法?

  - 常見的有浮動(dòng)和定位

  - 第一種:浮動(dòng)布局(float)浮動(dòng)一般用于讓塊級(jí)元素排成一行在同一行顯示任何元素都可浮動(dòng),如一個(gè)元素設(shè)置為浮動(dòng)元素,浮動(dòng)元素?zé)o論最初是什么都會(huì)變成一個(gè)行塊級(jí)元素,擁有disolay:inline-block屬性

  - 第二種:定位布局(position) 定位中的absolute絕對(duì)定位可以讓元素脫離文檔流的 如果父級(jí)有定位屬性就相對(duì)于父級(jí)定位 如果父級(jí)沒有就會(huì)一直往上級(jí)查找直至瀏覽器

  - 脫離文檔流布局的缺點(diǎn)初始位置不存在就會(huì)破壞網(wǎng)頁布局

  更多關(guān)于“web前端培訓(xùn)”的問題,歡迎咨詢千鋒教育在線名師。千鋒教育多年辦學(xué),課程大綱緊跟企業(yè)需求,更科學(xué)更嚴(yán)謹(jǐn),每年培養(yǎng)泛IT人才近2萬人。不論你是零基礎(chǔ)還是想提升,都可以找到適合的班型,千鋒教育隨時(shí)歡迎你來試聽。

tags:
聲明:本站稿件版權(quán)均屬千鋒教育所有,未經(jīng)許可不得擅自轉(zhuǎn)載。
10年以上業(yè)內(nèi)強(qiáng)師集結(jié),手把手帶你蛻變精英
請(qǐng)您保持通訊暢通,專屬學(xué)習(xí)老師24小時(shí)內(nèi)將與您1V1溝通
免費(fèi)領(lǐng)取
今日已有369人領(lǐng)取成功
劉同學(xué) 138****2860 剛剛成功領(lǐng)取
王同學(xué) 131****2015 剛剛成功領(lǐng)取
張同學(xué) 133****4652 剛剛成功領(lǐng)取
李同學(xué) 135****8607 剛剛成功領(lǐng)取
楊同學(xué) 132****5667 剛剛成功領(lǐng)取
岳同學(xué) 134****6652 剛剛成功領(lǐng)取
梁同學(xué) 157****2950 剛剛成功領(lǐng)取
劉同學(xué) 189****1015 剛剛成功領(lǐng)取
張同學(xué) 155****4678 剛剛成功領(lǐng)取
鄒同學(xué) 139****2907 剛剛成功領(lǐng)取
董同學(xué) 138****2867 剛剛成功領(lǐng)取
周同學(xué) 136****3602 剛剛成功領(lǐng)取
相關(guān)推薦HOT
軟件開發(fā)管理流程中會(huì)出現(xiàn)哪些問題?

一、需求不清需求不明確是導(dǎo)致項(xiàng)目失敗的主要原因之一。如果需求沒有清晰定義,開發(fā)人員可能會(huì)開發(fā)出不符合用戶期望的產(chǎn)品。二、通信不足溝通問...詳情>>

2023-10-14 13:43:21
軟件定制開發(fā)中的敏捷開發(fā)是什么?

軟件定制開發(fā)中的敏捷開發(fā)是什么軟件定制開發(fā)中的敏捷開發(fā),從宏觀上看,是一個(gè)高度關(guān)注人員交互,持續(xù)開發(fā)與交付,接受需求變更并適應(yīng)環(huán)境變化...詳情>>

2023-10-14 13:24:57
什么是PlatformIo?

PlatformIO是什么PlatformIO是一個(gè)全面的物聯(lián)網(wǎng)開發(fā)平臺(tái),它為眾多硬件平臺(tái)和開發(fā)環(huán)境提供了統(tǒng)一的工作流程,有效簡(jiǎn)化了開發(fā)過程,并能兼容各種...詳情>>

2023-10-14 12:55:06
云快照與自動(dòng)備份有什么區(qū)別?

1、定義和目標(biāo)不同云快照的主要目標(biāo)是提供一種快速恢復(fù)數(shù)據(jù)的方法,它只記錄在快照時(shí)間點(diǎn)后的數(shù)據(jù)變化,而不是所有的數(shù)據(jù)。自動(dòng)備份的主要目標(biāo)...詳情>>

2023-10-14 12:48:59
服務(wù)器為什么要用Linux?

服務(wù)器為什么要用Linux作為服務(wù)器操作系統(tǒng)的優(yōu)選,Linux在眾多選擇中脫穎而出。Linux作為服務(wù)器操作系統(tǒng)的優(yōu)選,有其獨(dú)特的優(yōu)勢(shì)和特點(diǎn)。包括其...詳情>>

2023-10-14 12:34:11
快速通道