在HTML5中如何设置屏幕百分比_随笔

<!DOCTYPE html>

<head>

</head>

.head{width: 1000pxheight: 200pxmargin:0 auto}

.head-a{width: 30%height: 200pxbackground: bluefloat: left}

.head-b{width: 70%height: 200pxbackground: orangefloat: right}

</style>

<body>

</div>

</body>

</html>

我们可以使用width：30%和width：70%这样的形式来设置百分比

1.左侧固定右侧自适应-定位步骤:

左侧宽度写死——》定位——》给父元素设置左padding即可

右侧宽度不用设置(自适应)

2.浮动+触发BFC 拓展:想详细了解BFC戳这里 overflow:hidden 会触发盒子的BFC 触发BFC的盒子的特点: 解决margin的塌陷清除浮动 ...

需要准备的材料分别有：电脑、浏览器、html编辑器。

1、首先，打开html编辑器，新建html文件，例如：index.html。

2、在index.html中的<style>标签中，输入css代码：span {font-size: 0.8em}。

3、浏览器运行index.html页面，此时span的字体大小被设置h1字体大小的80%。

欢迎分享，转载请注明来源：内存溢出

在HTML5中如何设置屏幕百分比