CSS進階(十三)font-size
line-height 的數值屬性值和 百分比值屬性值都是相對於 font-size
ex是x字符的高度
em
在 CSS 中,1em 的計算值等同於當前元素所在的 font-size 計算值,可以將 其想象成當前元素中(如果有)漢字的高度
rem
root em CSS3單位 ie9上支持
使用svg矢量圖時,建議使用em作為單位,這樣不論和大文字還是小文字在一起,都能和文字大小保持一致
font-size關鍵字屬性
font-size設置px,用戶設置瀏覽器字體不會有變化,設置百分比,用戶設置瀏覽器字體會影響布局,而使用medium(對應16px),就能解決上述的問題
(1)傳統的定寬桌面,也需要進行響應式處理,1200-800,可以保證至少有1.5倍的縮放空間,響應瀏覽器的字體號就可以忽略
(2)如果困各種原因無法做響應式處理,也沒有必要全局都使用相對單位,畢竟成本等現 實問題擺在那裏,其實只需要在圖文內容為主的重要局部區域使用可縮放的 font-size 處理 即可。與文字內容相關的地方建議摒棄px
font-size:0
chrome下有一個12px的根字號限制,但font-size:0不受影響,可以用來隱藏文字
CSS進階(十三)font-size
相關推薦
CSS進階(十三)font-size
lin 只需要 響應式 處理 傳統 oot 忽略 字符 成本 line-height 的數值屬性值和 百分比值屬性值都是相對於 font-size ex是x字符的高度 em 在 CSS 中,1em 的計算值等同於當前元素所在的 font-size 計算值,可以將 其想象成當
蘋果新的編程語言 Swift 語言進階(十三)--類型檢查與類型嵌套
兩個類 nes left p s 查詢 text edi host letter 一 類型檢查 1、 類型檢查操作符 類型檢查用來檢查或轉換一個實例的類型到另外的類型的一種方式。 在Swift中,類型檢查使用is和as操作符來實現。
CSS進階(三)padding
方向 圖片 小技巧 相對 水平 src -h color 點擊區域 內聯元素padding是有作用的 設置內聯級元素如a的垂直方向的padding,不僅能夠增加點擊區域的大小,也不會影響到整體的布局 padding的百分比值 padding的百分比值無論是水平方向還是垂直方
CSS進階(四)margin
off clas gin 提升 list div 保持 tom 觸發 margin 元素尺寸:border-box DOM屬性裏的offsetWidth 和offsetHeight 元素內部尺寸: padding-box DOM屬性裏的clientWidth 和 clie
CSS進階(七)vertical-align
htm overflow justify lin 設置 splay http ali 裏的 由於是相對字母 x 的下邊緣對齊,而中文和部分英文字形的下邊緣要低於字母 x 的下邊緣,因 此,會給人感覺文字是明顯偏下的,一般都會進行調整。 vertical-align屬性值 (
CSS進階(九) position:absolute
剪裁 ble 展現 splay ng- 祖先 isp 使用 之間 特性 (1)塊狀化,display渲染為block或table (2)文檔流破壞性 (3)包裹性 (4)塊狀格式化上下文,也就是BFC,absolute 的自適應性最大寬度往往不是由父元素決定的 absolu
CSS進階(十)position:relative
ati 進階 最小化 相對 pan style 而不是 原則 round 定位位移相對於自身進行偏移定位 相對定位元素的 left/top/right/bottom 的百分比值是相對於包含塊計算的,而不是自身 與絕對定位元素的對立方向不同,top/bottom 同時使 用的
java程式設計師菜鳥進階(十三)linux基礎入門(一)vmvare下安裝linux RedHat圖解(超詳細篇)
對於linux,我從大二就想學習一下,但一直苦於無從下手,所以一直拖到現在,鑑於筆者瞭解很多人在linux入門的困難在何處,所以我認為本套入門基礎文章還是挺適合想學習linux的朋友,本系列文章大約十篇文章左右,近期會不斷更新下來,沒有linux基礎但又想學習linux的朋友可以關注一下本系列
前端基礎進階(十三):透徹掌握Promise的使用,讀這篇就夠了(轉)
https://www.jianshu.com/p/fe5f173276bd Promise的重要性我認為我沒有必要多講,概括起來說就是必須得掌握,而且還要掌握透徹。這篇文章的開頭,主要跟大家分析一下,為什麼會有Promise出現。 在實際的使用當中,有非常多的應用場景我們不能立即知道應該如
SQL Server進階(十三)常用函式
DATE DECLARE @now DATETIME SELECT @now = GETDATE() SELECT DATEPART(YEAR, @now) SELECT DATEPART(MONTH, @now) SELECT DATEPART(DAY,
SQL Server進階(十三)常用函數
bst tsm replace null sdn res 函數 row cnblogs DATE DECLARE @now DATETIME SELECT @now = GETDATE() SELECT DATEPART(YEAR, @now) S
CSS進階(20)—— CSS中的裝飾屬性和使用者體驗屬性
本章主要來聊聊CSS中一些雜七雜八的屬性,個人會將裡面的坑提取出來測試一遍加深下印象,比較符合常規的屬性這裡就不贅述了。 1.與眾不同的background-position屬性 background-position屬性支援數值,百分比,關鍵字。
CSS進階(19)—— 詳解display:none和visibility: hidden的區別
本章的主要內容是利用CSS控制元素的“顯隱”,說道顯隱,之前其實已經提供了一些非常規的CSS方法,如clip,z-index,opacity等,本章我們來深入探究一下display:none和visibility: hidden折兩個屬性。 1.display與元素的顯隱
CSS進階(18)—— CSS中的文字處理(下)
CSS有很多屬性專門用來對文字進行控制,由於這些屬性的作用機制往往是基於內聯盒模型的,因此對於內聯塊狀元素也是有效果的,如我們最常用的text-align:center可以讓內聯元素水平居中。本章我們就來深入探索一下CSS中的文字控制屬性。 1.text-indent負值的妙用
CSS進階(17)—— CSS中的文字處理(上)
CSS能夠在眾多的佈局標準中脫穎而出的制勝手段就是其強大的文字處理能力,比如最"簡單"的盒子邊緣文字即將超出就自動換行的能力在CSS流的概念裡幾乎是天生的,並逐漸成為了行業內的“常規認知”,然而同時代的SVG標準要想讓文字換行,還需要你手動處理一下,對於計算機來說,沒有什麼是與生俱
CSS進階(16)—— CSS世界的層疊規則(下)
上一章我們主要了解了層疊上下文,層疊水平,CSS層疊領域的兩大黃金法則等概念,本章我們講繼續深入探索CSS世界的層疊規則。 1.深入理解層疊上下文 “層疊上下文”的元素有如下的一些特性: (1)預設層疊水平(z-index:auto)比普通元素要高 (
CSS進階(15)—— CSS世界的層疊規則(上)
說到CSS世界的層疊規則,很多人會想到z-index,翻譯成中文,叫做"z軸的順序"。事實上,拋開z-index只有在部分元素中(如定位元素)生效的條件,任何“元素”都無需藉助z-index的支援會有自己的層疊規則,這個層疊順序是基於z軸的。這裡我們需要了解一個概念,儘管我們平時看
CSS進階(14)—— position:absolute如此高深,我當真不懂(下)
上章我們聊了和absolute的流體特性以及和absolute搭配使用的CSS屬性,本章我們就來聊一聊position家族的另外兩大成員——relative和fixed。 1.relative的定位(不推薦使用) 理論上relative/ab
CSS進階(13)—— position:absolute如此高深,我當真不懂(中)
在上文中,我們探討了絕對定位的包含塊以及“無依賴絕對定位”的特性,本章我們來聊聊absolute的流體特性以及那些和absolute關係甚好的CSS屬性。 1.absolute的流體特性 在前面一文中,我們測試了很多“無依賴絕對定位”的特殊表現,事實上在平時開
CSS進階(12)—— position:absolute如此高深,我當真不懂(上)
之前在探討float屬性的時候就已經提到了position:absolute的概念,絕對定位和浮動在很多方面都具有相似性,包括“塊狀化”,“包裹性”,“破壞性”等等,在理論層面上兩者是一對兄弟關係。然而在實際場景中,由於絕對定位的“破壞性”通常比float的要強,因此會有人覺得絕對