流式布局rem vm/vh px em的區別
- rem
- rem是相對于根元素 html,這樣就意味著,我們只需要在根元素確定一個font-size字號,則可以來算出元素的寬高
- px
- px意為像素 , 是設備或者圖片最小的一個點,比如常常聽到的電腦像素是1920x1080的,表示的是水平方向是1920個像素點,垂直方向是1080個像素點。是我們網頁設計常用的單位,也是基本單位。通過px可以設置固定的布局或者元素大小,缺點是沒有彈性。
- em
- 參考物是父元素的font-size,具有繼承的特點。如果自身定義了font-size按自身的font-size來計算(瀏覽器默認字體是16px),整個頁面內1em不是一個固定的值。
特點是1. em的值并不是固定的; 2. em會繼承父級元素的字體大小。
- vw/vh
- vw view width的簡寫,是指可視窗口的寬度。假如可視區域寬度是1920px的話。那1vw = 1920px/100 = 19.2px
- vh view height的簡寫,是指可視窗口的高度。假如可視區域寬度是1080px的話。那1vh = 1080px/100 = 10.8px
- vm
- 相對于視口的寬度或高度中較小的那個。最小的那個被均分為100單位的 vm
- 例如: 瀏覽器高度900px,寬度1200px,取最小的瀏覽器高度,1vm = 900px / 100 = 9px。
媒體查詢是什么
媒體查詢:是可以讓我們根據設備顯示器的特性(如視口寬度、屏幕比例、設備方向:橫向或縱向)為其設定CSS樣式,媒體查詢中可用于檢測的媒體特性有 width 、 height 和 color (等)。使用媒體查詢,可以在不改變頁面內容的情況下,為特定的一些輸出設備定制顯示效果。
媒體查詢的基本語法如下:
```
@media 媒體設備 and (min-width:300px){
選擇器{
屬性:值;
}
}
@media 表示媒體查詢
screen 表示查詢設備;媒體設備是個變量,在什么設備下就使用什么值
speech 閱讀設備 all所有設備 screen 電腦手機平板
and 鏈接符號;并列條件
(屏幕條件)
max-width:230px 在230px以下的尺寸中。使用媒體樣式。
min-width:230px 表示在大于230px尺寸中使用媒體樣式。
```
能夠設置文本加粗的樣式屬性是什么
加粗屬性為 font-weight:屬性值; 效果為加粗的值有 bold bolder 600 700 800 900
更多關于“web前端培訓”的問題,歡迎咨詢千鋒教育在線名師。千鋒教育多年辦學,課程大綱緊跟企業需求,更科學更嚴謹,每年培養泛IT人才近2萬人。不論你是零基礎還是想提升,都可以找到適合的班型,千鋒教育隨時歡迎你來試聽。