国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

img標(biāo)簽設(shè)置display:block，寬度無(wú)法100%

MorePainMoreGain / 786人閱讀

摘要：替換元素瀏覽器根據(jù)元素的標(biāo)簽和屬性，來(lái)決定元素的具體顯示內(nèi)容。替換元素是其內(nèi)容不受視覺(jué)格式化模型控制的元素，例如標(biāo)簽，嵌入的文檔之類或者，這些叫做替換元素。

img標(biāo)簽設(shè)置display:block，寬度無(wú)法100% 
一些個(gè)人總結(jié)，第一次發(fā)文章，有什么不足的地方，還請(qǐng)各位多提意見(jiàn)
現(xiàn)象

如下代碼，img標(biāo)簽設(shè)置了display：block，尺寸寬度無(wú)法設(shè)定為100%




    
    img標(biāo)簽設(shè)置display:block，寬度無(wú)法100%
原因 替換元素和非替換元素 
元素是文檔結(jié)構(gòu)的基礎(chǔ)，在CSS中，每個(gè)元素生成了一個(gè)包含了元素內(nèi)容的框（box,也翻譯為“盒子”）。但是不同的元素顯示的方式會(huì)有所不同，例如div和span不同，而strong和p也不一樣。在文檔類型定義（DTD）中對(duì)不同的元素規(guī)定了不同的類型，這也是DTD對(duì)文檔之所以重要的原因之一。而根據(jù)元素本身的特點(diǎn)可以分為替換元素（replaced element）和非替換元素，非替換元素，在W3C中沒(méi)有給出明確的定義，但我們可以由替換元素對(duì)應(yīng)著非替換元素，所以可以理解為除了替換元素，其它的就是非替換元素。

替換元素：瀏覽器根據(jù)元素的標(biāo)簽和屬性，來(lái)決定元素的具體顯示內(nèi)容。替換元素是其內(nèi)容不受CSS視覺(jué)格式化模型控制的元素，例如img標(biāo)簽，嵌入的文檔（iframe之類）或者applet，這些叫做替換元素。比如img元素通過(guò)src屬性的值來(lái)讀取圖片信息并顯示出來(lái)，而如果查看(x)html代碼，卻看不到圖片的實(shí)際內(nèi)容，而且img元素的內(nèi)容通常會(huì)被src屬性指定的圖像替換掉；例如input元素的type屬性決定是顯示輸入框，還是單選按鈕等。(x)html中的img , input , textarea , select , object都是替換元素。這些元素沒(méi)有實(shí)際的內(nèi)容，即是個(gè)空元素

非替換元素：(X)HTML 的大多數(shù)元素是非替換元素，他們將內(nèi)容直接告訴瀏覽器，將其顯示出來(lái)

img標(biāo)簽為替換元素，替換元素的特性之一就是尺寸由內(nèi)部元素決定，且無(wú)論其 display 屬性值是 inline 還是 block。這個(gè)特性很有意思，對(duì)于非替換元素，如果其 display 屬性值為 block，則會(huì)具有流動(dòng)性，寬度由外部尺寸決定，但是替換元素的寬度卻不受 display 水平影響，因此，display 水平是無(wú)法讓尺寸 100%自適應(yīng)父容器的

解決

解決辦法就是，通過(guò)設(shè)定的width尺寸 100%




    
    img標(biāo)簽設(shè)置display:block，寬度無(wú)法100%
小結(jié)

剛開(kāi)始的博客之旅，記錄一些自己學(xué)習(xí)點(diǎn)滴和經(jīng)驗(yàn)，接下來(lái)會(huì)不斷努力的探索和記錄，希望文章能有助于各位，有什么不足之處，還望大家多多指出

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://m.specialneedsforspecialkids.com/yun/113721.html

相關(guān)文章

  • 自適應(yīng)寬度元素單行文本省略用法探究

    摘要：?jiǎn)涡形谋臼÷院驮丶捌涓冈氐膶傩远紵o(wú)關(guān)元素或?yàn)樵貎?nèi)單行文本省略，需要給元素或?yàn)樵靥砑訕邮綖樵氐淖釉厝绻亲赃m應(yīng)寬度時(shí)，內(nèi)的子元素實(shí)現(xiàn)單行文本省略，需要給添加樣式單行文本省略是現(xiàn)代網(wǎng)頁(yè)設(shè)計(jì)中非常常用的技術(shù)，幾乎每個(gè)站點(diǎn)都會(huì)用到。單行文本省略適用于顯示摘要信息的場(chǎng)景，如列表標(biāo)題、文章摘要等。在響應(yīng)式開(kāi)發(fā)中，自適應(yīng)寬度元素單行文本省略容易失效不起作用，對(duì)網(wǎng)頁(yè)開(kāi)發(fā)這造成困擾。因此，本文將要...

    K_B_Z 評(píng)論0 收藏0

  • 你不知道的CSS

    摘要：不要忘了給子元素設(shè)置字號(hào)用來(lái)清除浮動(dòng)除了著名的清除浮動(dòng)類，利用屬性也可以清除浮動(dòng)。 本文首發(fā)于我的博客 CSS的世界是神奇的。隨著各瀏覽器WEB標(biāo)準(zhǔn)的日趨統(tǒng)一，CSS在WEB世界中扮演的角色也愈發(fā)的重要。甚至于在GitHub上出現(xiàn)了You-Dont-Need-JavaScript這樣Star近萬(wàn)的優(yōu)秀開(kāi)源項(xiàng)目，拋開(kāi)該項(xiàng)目的實(shí)用性不說(shuō)，項(xiàng)目中的眾多的DEMO就已經(jīng)證明了CSS的強(qiáng)大。當(dāng)然...

    cnio 評(píng)論0 收藏0

  • 淺析RWD

    摘要：三響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)的基本原理標(biāo)簽，允許頁(yè)面寬度自動(dòng)調(diào)整大多數(shù)移動(dòng)瀏覽器將頁(yè)面放大為寬的視圖以符合屏幕分辨率。解決方案使用，選擇器清除浮動(dòng)，只適用于非瀏覽器。由于移動(dòng)設(shè)備屏幕大小的限制，在其上進(jìn)行顯示的內(nèi)容一般是經(jīng)過(guò)精心篩選的。 一、前言 現(xiàn)今，無(wú)論是移動(dòng)設(shè)備、平板電腦、PC，屏幕大小各不相同，若是針對(duì)每個(gè)屏幕大小單獨(dú)設(shè)計(jì)一個(gè)解決方案，則會(huì)大幅增加網(wǎng)站建設(shè)的復(fù)雜程度和運(yùn)營(yíng)成本。響應(yīng)式網(wǎng)頁(yè)設(shè)...

    0x584a 評(píng)論0 收藏0

  • 淺析RWD

    摘要：三響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)的基本原理標(biāo)簽，允許頁(yè)面寬度自動(dòng)調(diào)整大多數(shù)移動(dòng)瀏覽器將頁(yè)面放大為寬的視圖以符合屏幕分辨率。解決方案使用，選擇器清除浮動(dòng)，只適用于非瀏覽器。由于移動(dòng)設(shè)備屏幕大小的限制，在其上進(jìn)行顯示的內(nèi)容一般是經(jīng)過(guò)精心篩選的。 一、前言 現(xiàn)今，無(wú)論是移動(dòng)設(shè)備、平板電腦、PC，屏幕大小各不相同，若是針對(duì)每個(gè)屏幕大小單獨(dú)設(shè)計(jì)一個(gè)解決方案，則會(huì)大幅增加網(wǎng)站建設(shè)的復(fù)雜程度和運(yùn)營(yíng)成本。響應(yīng)式網(wǎng)頁(yè)設(shè)...

    _Dreams 評(píng)論0 收藏0

  • CSS display 屬性詳解

    摘要：如果項(xiàng)目只有一根軸線，該屬性不起作用。后兩個(gè)屬性可選。彈性比為的子代占據(jù)父代框的空間是彈性比為的同級(jí)屬性的兩倍。其默認(rèn)值為，也就是不具有彈性。此元素會(huì)根據(jù)上下文作為塊級(jí)元素或內(nèi)聯(lián)元素顯示柵格模型，類似柵格模型，類似轉(zhuǎn)自屬性詳解作者 display的所有屬性 {/* CSS 1 */ display: none; display: inline; display: block; disp...

    xingqiba 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<