css用百分比控制 |css字体设置失效

例如：将HTML中的div元素的宽度设置为50%。
div{
width:50%;
}

上面的代码将这个div元素的宽度设置为其父元素宽度的50%，这样当父元素的宽度发生变化时，这个div的宽度也会自动调整。百分比可以根据父级元素的尺寸来进行相应的调整，可以让页面更加灵活和自适应。

又如：将HTML中的图片元素的宽度设置为80%。
img{
width:80%;
}

上述代码将这个图片元素的宽度设置为其容器宽度的80%，这样可以让图片随容器的大小调整而自适应。另外，百分比还可以用于网格布局等高级布局技术中，可以让元素按比例分配空间。

例如：使用CSS网格布局，将HTML中的两个元素分别设置为占据父元素的50%宽度。
.container{
display:grid;
grid-template-columns:50% 50%;
}
.item{
background-color:#ddd;
padding:20px;
text-align:center;
}

上面的代码将这个容器元素设置为网格布局，然后将两个子元素的宽度都设置为50%，这样就可以实现等宽排列。网格布局是一种现代的CSS布局方式，可以提供更加灵活和强大的布局能力。

综上所述，百分比是CSS中非常常用的单位，它可以让网页具有更加自适应和灵活的特性，可以让开发者更加轻松地掌控网页样式和布局。