亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

困然許久的vertical-aligin,間隙的出現(xiàn)并不是bug,!!!!

lsxiao / 2205人閱讀

摘要:最近學(xué)習(xí)一個出現(xiàn)一個奇怪的現(xiàn)象,話不多說先貼代碼。當(dāng)初認為由于設(shè)置成了之后,換行和空格都被解析造成的,然是后來已測試,發(fā)現(xiàn)根本不是這個原因造成的,最近經(jīng)過自己的苦思冥想,查閱資料,竟然發(fā)現(xiàn)是搞得鬼。因為浮動不屬于行內(nèi)元素了。

最近學(xué)習(xí)一個html,出現(xiàn)一個奇怪的現(xiàn)象,話不多說先貼代碼。

`


    
    Document




    
    


` ----------

這是代碼。。。

當(dāng)初認為由于設(shè)置成了line-blcok之后,換行和空格都被解析造成的,然是后來已測試,發(fā)現(xiàn)根本不是這個原因造成的,最近經(jīng)過自己的苦思冥想,查閱資料,竟然發(fā)現(xiàn)是vertical-align搞得鬼。

現(xiàn)在我來解釋下原因,不過要明白的話,需要了解行高,基線等概念
我先在舉幾個例子




    
    Document




    
    

x我

效果:

可能大家沒注意到:這個現(xiàn)象已經(jīng)說明了原因,現(xiàn)在我來分下下:
**

1. 了解x;我們知道x的底部是基線,但是根據(jù)分析,基線下面應(yīng)該有底線,底線下面有一半的行高,


2.我們可以看到x是和div垂直平齊的,這個也是google瀏覽器默認的文本以基線居中,但是基線下面還有到底線的距離和半個行高。因此為了容下字體,下面的div需要向下移動  基線到底線的距離+一半的行高
3.在google瀏覽器中,默認字體大小16px,ling-height是18px,我測量他們的縫隙是3px,就可以知道他們一半的行高是1px,基線到底線的距離是2px,
總結(jié):這個就是出現(xiàn)縫隙的原因所在了。   

**
解決辦法:

1.浮動。因為浮動不屬于行內(nèi)元素了。
2.改變vertical-align的對齊方式,適應(yīng)top,和bottom可以消除縫隙,
注意:是用text_top 和text_bottom任然會出現(xiàn)縫隙但是比之前小一點,因為他們是跟字體對齊,換句話說,他們沒有基線到底線的距離,只有一半行高的距離,所以縫隙會變小。

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

轉(zhuǎn)載請注明本文地址:http://www.ezyhdfw.cn/yun/115364.html

相關(guān)文章

  • 困然許久vertical-aligin,間隙出現(xiàn)不是bug,!!!!

    摘要:最近學(xué)習(xí)一個出現(xiàn)一個奇怪的現(xiàn)象,話不多說先貼代碼。當(dāng)初認為由于設(shè)置成了之后,換行和空格都被解析造成的,然是后來已測試,發(fā)現(xiàn)根本不是這個原因造成的,最近經(jīng)過自己的苦思冥想,查閱資料,竟然發(fā)現(xiàn)是搞得鬼。因為浮動不屬于行內(nèi)元素了。 最近學(xué)習(xí)一個html,出現(xiàn)一個奇怪的現(xiàn)象,話不多說先貼代碼。 ` Document *{ margin:0; padd...

    antz 評論0 收藏0
  • 為什么開發(fā)人員必須要了解數(shù)據(jù)庫鎖?

    摘要:小明馬上開發(fā)完畢,成功上線。下班過后,小明回想大紅說的話,什么是間隙鎖,什么是插入意向鎖,看來作為開發(fā)者對數(shù)據(jù)庫不應(yīng)該只會寫啊,不然遇到一些疑難雜癥完全沒法解決啊。破壞了數(shù)據(jù)庫中的隔離性。 1.鎖? 1.1何為鎖 鎖在現(xiàn)實中的意義為:封閉的器物,以鑰匙或暗碼開啟。在計算機中的鎖一般用來管理對共享資源的并發(fā)訪問,比如我們java同學(xué)熟悉的Lock,synchronized等都是我們常見的...

    AbnerMing 評論0 收藏0
  • 9:瀏覽器兼容

    摘要:由和開發(fā)的瀏覽器排版引擎,年月發(fā)布。瀏覽器的兼容問題是我們必須去克服的。表示過濾器的意思,它是一種對特定的瀏覽器或瀏覽器組顯示或隱藏規(guī)則或聲明的方法。? 9:瀏覽器兼容 常見的主流瀏覽器 1)主流瀏覽器 Internet Explorer、 Safari、Mozilla Firefox、 Google Chrome、Opera、百度、360、搜狗、傲游 2)最早的瀏覽器 : Mosaic ...

    AWang 評論0 收藏0
  • MySQL - 事務(wù)啟動 / 設(shè)置 / 鎖 / 解鎖——入門

    摘要:行級鎖,頁級鎖,表級鎖。聞其名知其意,比較少見的是頁級鎖,它鎖定的是一組相鄰數(shù)據(jù)。排他鎖允許獲得排他鎖的事務(wù)更新數(shù)據(jù),阻止其他事務(wù)取得相同數(shù)據(jù)集的讀寫。意向排他鎖事務(wù)打算給數(shù)據(jù)行加行排他鎖,事務(wù)在給一個數(shù)據(jù)行加排他鎖前必須先取得該表的鎖。 廢話 本篇的名字簡直可以起成《事務(wù)操作:從入門到放棄》。 力圖解決:在MySQL 5.5 版本及更高版本時,使用事務(wù)的完整流程和細節(jié)記錄,而無需面對...

    iOS122 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<