在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%这样的形式来设置百分比

width和height属性是指你设置的宽度和高度，百分比指你设计的东西占屏幕大小的百分比。

例如你在写一个表格的时候：

<html>

<body>

<tr>

</tr>

<tr>

</tr>

<tr>

</tr>

</table>

</body>

</html>

你通过调整百分比可以看到表格占总页面的大小的比例也随之改变！

希望以上对你有用！

原理：

先给父级<div>设置宽度（像素）

然后再子<div>里，设置百分比，如图示。

代码原件：

复制到<body></body>之间使用即可。

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

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