北京網站建設>建站知識>開發小記>

開發小記

px,vh,vw,百分比等布局單位的區別

來源:未知 作者:admin 時間:2019-04-02 16:41 點擊:

網站開發過程中,很多人可能會對px,vh,vw,百分比等單位有很多的疑惑,其實理解了這些東西,使用起來也是非常的簡單,下面就講解一下講解網站px,vh,vw,百分比等布局單位的區別。

首先介紹px,px是css樣式里最基本的單位,相信大家也不陌生,字體或盒子的寬高布局中使用px單位,那么我們給元素設置多少px就是設置多少px,無論你的電腦屏幕有多大,無論你的手機屏幕有多小,元素的大小是不會改變的,

再說vh與vw,vw的含義是窗口的寬度,我們可以理解為瀏覽器可視窗口的寬度,100VW等于可視窗口的寬度,同理100VH等于可視窗口的高度,并且這個單位可以給文字使用,可以實現在瀏覽器視窗窗口的大小發生變化時而改變自身的大小,這個單位類似于百分比,可能很多人也分不清他們的關系,沒有關系,一會我們在詳細的講解他們的區別。

現在就是百分比啦,百分比比較好理解,但是在默認的情況下,百分比只能給盒子設置寬度,高度百分比是不生效的,但是可以通過其他方法讓百分比高度生效,這里就不進行說明,百分比是繼承父級元素的,如果父級是90%或900px的寬度,那么子級的百分之百便是90%或900px的寬度,但vw不同,100vw永遠都是滿屏的寬度,繼承的的是屏幕可視窗口的寬度,vh同理,是繼承了可視窗口的高度,與百分比不同的是,使用vh給元素設置高度,是有真實高度的。

rem多用于手機布局,rem更精確,其實rem這個單位本身是死的,什么是死的?就是和px一樣,需要通過JS去控制才能達到想要的效果,想要的效果也就類似于百分比。

公司業務:北京網站建設刷百度下拉刷百度指數虛擬主機租用

如轉載,請保留本文鏈接地址:http://www.imnrhk.live/Web/Diary/2029/

Loading......
工作時間:

AM 09:00 ~ 12:00

PM 14:00 ~ 18:00

聯系方式:

Tel 010-50933590

Hp 18701620736

設計優勢

獨立的設計團隊 帶給您全新的視覺體驗

功能開發

強大的技術實力,完成您想要的任何功能

售后服務

完善的售后服務,解決您在使用過程中遇到的問題

Copyright © 2010 - 2018 北京順晟科技發展有限公司 All Rights Reserved

地址:北京市順義區南法信政府府前街16號 炫立方 | TEL:010-50933590

北京網站建設 | 北京網站設計 | 北京SEO公司

永恒宝钻电子