麻豆黑色丝袜jk制服福利网站-麻豆精品传媒视频观看-麻豆精品传媒一二三区在线视频-麻豆精选传媒4区2021-在线视频99-在线视频a

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

手機站
千鋒教育

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

千鋒教育

掃一掃進入千鋒手機站

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

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

當(dāng)前位置:首頁  >  應(yīng)聘面試  >  html5面試題  > 前端面試題總結(jié)整理之display篇

前端面試題總結(jié)整理之display篇

來源:千鋒教育
發(fā)布人:syq
時間: 2022-07-14 14:16:30 1657779390

  1、display:inline-block后為什么有間距?

  - display:inline-block是讓元素在一行顯示,但是這些元素在html里面是上下行排列的,所以中間有換行符,于是并排顯示就有了換行符帶來的空隙。

千鋒教育

  - 解決這種問題的方式有:

  - 將html標簽要display:inline-block 的元素寫在一行。缺點:代碼可讀性差。

  - 給父元素設(shè)置font-size:0,給子元素設(shè)置需要的font-size值。缺點:是子元素如果里面有文字,文字會消失不見,所以又要給子元素設(shè)置font-size,增加了代碼量。

  - 給元素設(shè)置float:left,缺點需要清除浮動。

  - 設(shè)置子元素的margin-left為負值,但是元素之間的間隙大小是根據(jù)上下文的字體大小確定的,而每個瀏覽器的換行空隙大小不同,所以這個方法不通用。

  - 設(shè)置父元素 display:table;word-spacing:-1em;目前這個方法可以完美解決,且兼容其他瀏覽器。

  2、display有哪幾種屬性值?分別代表什么?Img屬于什么元素?

  display屬性的含義:display控制元素的顯示類型:

  display屬性的屬性值可以分成兩大類

  常用的屬性值

  none代表為不顯示:控制元素的隱藏

  block代表顯示為塊級元素:還可以讓元素控制元素顯示

  塊級元素的特點:默認站寬一整行,能設(shè)置寬度高度,縱向排列

  塊級元素有:div,p,h1,h6,ol,ul,ol,li,dl,dt,dd,form,fieldset,legend,table,header,footer,section,main,nav,article,aside等等

  inline代表行內(nèi)元素;

  行內(nèi)元素的特點:不能設(shè)置寬度高度,并且能橫向顯示

  行內(nèi)元素有:a,b,strong,u,i,em,s,del,sup,sub,span,font,mark,var

  inline-block代表行內(nèi)塊元素

  行內(nèi)塊元素的特點:能設(shè)置寬度高度并且橫向顯示

  行內(nèi)塊元素有:input,textarea,select,

  flex代表的是觸發(fā)彈性盒子

  grid代表的是觸發(fā)網(wǎng)格布局

  - 不常用的屬性值

  list-item 此元素會作為列表顯示。

  run-in 此元素會根據(jù)上下文作為塊級元素或內(nèi)聯(lián)元素顯示。

  compact CSS 中有值 compact,不過由于缺乏廣泛支持,已經(jīng)從 CSS2.1 中刪除。

  marker CSS 中有值 marker,不過由于缺乏廣泛支持,已經(jīng)從 CSS2.1 中刪除。

  table 此元素會作為塊級表格來顯示(類似 ),表格前后帶有換行符。

  inline-table 此元素會作為內(nèi)聯(lián)表格來顯示(類似 ),表格前后沒有換行符。

  table-row-group 此元素會作為一個或多個行的分組來顯示(類似 )。

  table-header-group 此元素會作為一個或多個行的分組來顯示(類似 )。

  table-footer-group 此元素會作為一個或多個行的分組來顯示(類似 )。

  table-row 此元素會作為一個表格行顯示(類似 )。

  table-column-group 此元素會作為一個或多個列的分組來顯示(類似)。

  table-column 此元素會作為一個單元格列顯示(類似 )

  table-cell 此元素會作為一個表格單元格顯示(類似 和 )

  table-caption 此元素會作為一個表格標題顯示(類似)

  inherit 規(guī)定應(yīng)該從父元素繼承 display 屬性的值。

  - img屬于什么元素:

  瀏覽器中的computed計算屬性中的圖片的display的取值為inline,雖然為inline但是實際開發(fā)的時候圖片是作為行內(nèi)塊元素進行使用的,因為遵循能設(shè)置寬度高度,并且還能橫向顯示;所以屬于行內(nèi)塊元素,但是有些程序員也會把圖片認為是行內(nèi)元素也是可以,從另一個角度講img也稱作是置換元素。

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

tags:
聲明:本站稿件版權(quán)均屬千鋒教育所有,未經(jīng)許可不得擅自轉(zhuǎn)載。
10年以上業(yè)內(nèi)強師集結(jié),手把手帶你蛻變精英
請您保持通訊暢通,專屬學(xué)習(xí)老師24小時內(nèi)將與您1V1溝通
免費領(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
快速通道
主站蜘蛛池模板: 欧美日产国产亚洲综合图区一 | 2021韩国三级理论电影网站| 亚洲一区二区三区在线| 免费日韩三级电影| 亚洲欧美成人一区二区在线电影| 日韩一级在线播放免费观看| 日日操夜夜操免费视频| 好男人好视频手机在线| 欧美另类专区| 免费看国产一级特黄aa大片| 一二三四社区在线视频社区| 欧美亚洲精品suv| 2018中文字幕第一页| 四虎永久免费地址ww484e5566| xl上司带翻译无马赛樱花| 黄色中文字幕在线观看| 最近免费中文字幕大全| 国产理论片在线观看| 免费中韩高清无专码区2021| 精品毛片视频| chinese国产xxxx实拍| 四虎影视永久地址www成人| 亚洲伊人色欲综合网| 黄色片三| 一区二区三区www| 性大毛片视频| 2021天天干| 中文字幕按摩| 最近中文字幕大全免费版在线| 亚洲欧美色鬼久久综合| 大胸年轻的搜子4理论| 国产大片黄在线观看| 久久久久亚洲精品影视| 久久精品国产精品国产精品污| 99久久精品费精品国产| 美女扒开尿口给男人爽免费视频| 8090韩国理伦片在线天堂| 伦理h动漫| 波多野结衣中文字幕一区| 国产无套粉嫩白浆在线观看| 黄页免费看|