web設計 2 靈活的文字

2022-09-15 19:12:14 字數 509 閱讀 8904

最佳設計:可以讓使用者自由控制任何頁面的文字大小。

瀏覽器中使用者都是可以自定義預設的文字大小的,如果使用 px,使用者自行在瀏覽器設定中改變了文字大小後,網頁上是不會變化的。我們不能排除視障使用者(如近視)、老年使用者不會這麼做.

利用css3的rem單位,避免了em相對父元素比例的巢狀問題,為了相容ie低版本的需要新增px單位.

html body h1

既然 rem 的可用性更好,是不是在所有地方都去使用呢?

通常在標題,正文等大面積文字的位置可以使用 rem。

但是在一些特殊的設計場景,rem 可能會導致布局錯位,比如這樣乙個回頂部的按鈕:

可以看到」回頂部」三個字通過放大已經改變的樣式,這是不希望看到的,這了最好只用px

《無懈可擊的Web設計》 靈活的文字

常見的方法 body使用畫素單位的優點 為什麼這麼做不是無懈可擊的?我們有哪些選擇?表示相對大小的關鍵字 百分比值 表示絕對大小的關鍵字 他們之間都是以1.5倍為差 無懈可擊的方案 通過em實現靈活的文字 rem單位 補充幾種響應式中使用的單位 vh and vw 響應式web設計離不開百分比。但是...

設計靈活的程式

高階程式設計師首先是乙個高階的程式設計師,這樣的程式設計師不僅要有良好的分析能力,還要有高超的設計能力。乙個優秀的程式應該有這樣三個優秀特性 靈活性 穩定性 精準性。其中,靈活性是來自需求的多樣化。多元的需求會產生功能模組的最小化。最小化模組的設計準則 重要引數 復用度 一般是根據需求共性得出 核心...

靈活XHTML和CSS網頁設計2 導航選單的設計

簡單列舉下設計導航選單時要考慮的一些因素 1,完全基於的選單導航意味著弱視的人無法調整選單字型的大小。而且每次更新選單時都要製作。2,用無序列表 ul 做選單,對不同瀏覽器和裝置 如移動裝置 更具親和性。3,基於文字的選單容易更新和修改 4,在導航選單的細節設計時,創意地利用背景可以美觀而又不缺乏靈...