h1=32px、h2=24px、h3=18.72px、h4=16px、p=16px、h5=13.28px、h6=12px,操作方法如下:
1、首先新建一个工程,new一个project。
2、接着在project中找到staticweb,自己填名字。
3、在创建好的html中创建html5文件,输入想要的html名字。
4、然后在打开的页面中,输入的文字添加h1到h6的字。
5、输入完成后,打开浏览器,显示的内容如下,就完成了。
常用的布局单位包括像素( px ),百分比( % ), em , rem , vw/vh 。
(1)像素 ( px )是页面布局的基础,一个像素表示终端(电脑、手机、平板等)屏幕所能显示的最小的区域,像素分为两种类型:CSS像素和物理像素:
(2)百分比 ( % ),当浏览器的宽度或者高度发生变化时,通过百分比单位可以使得浏览器中的组件的宽和高随着浏览器的变化而变化,从而实现响应式的效果。一般认为子元素的百分比相对于直接父元素。
(3)em和rem 相对于px更具灵活性,它们都是相对长度单位,它们之间的区别: em相对于父元素,rem相对于根元素。
(4)vw/vh 是与视图窗口有关的单位,vw表示相对于视图窗口的宽度,vh表示相对于视图窗口高度,除了vw和vh外,还有vmin和vmax两个相关的单位。
vw/vh 和百分比很类似,两者的区别:
物理像素 : 也是 设备像素 , 单位是 pt ,绝对单位。1pt就是一个会发光的点。设备出厂的时候就已经确定, 不会再改变。在我们的常识中反应为 分辨率 ,例如 1920 * 1080 分辨率指的就是这个设备有 1920*1080 个 pt
css 像素 : 设备独立像素, 逻辑像素。代表了可以通过程序控制的像素。
px 是一个相对单位。大小会随着屏幕物理特性的改变,而变得不确定。 css 像素的大小由物理像素所决定。 例如打印机的物理像素是一个墨点的大小。用户的缩放也会改变 css 像素在屏幕上的表现。
屏幕尺寸 : 对角线的长度。 1inch =2.54cm . 屏幕尺寸 = 屏幕对角线经过的像素数量 / PPI(pixel per inch ) **注意是 1inch 面积上的像素数量 **。
PPI : 固定的参数。 PPI 越大, 屏幕越清晰。 PPI 翻一倍,容纳像素量提升 四倍 。像素所占大小缩小为 1/4
720P : 1280 * 720
1080P : 1920 * 1080
4K : 4096 * 2160
5K : 5120 * 2880
像素比 : DPR = 物理像素 / css像素 。它反映了一个css像素, 占据多少个物理像素。 可以使用 window.devicePixelRatio 获取。