css 习题,css表格的宽度自适应

CSS是前端开发中必不可少的一门技术。在学习CSS的过程中，习题是一种非常重要的练习方式。通过不断练习，可以深入理解各种CSS属性、选择器和动画等应用方法，提升自己的CSS水平。 下面大家来看一些常见的CSS习题： 第一题：实现盒模型 使用CSS实现一个宽度为200px，高度为100px的盒子，并设置内边距padding为20px，外边距margin为10px。 解决方案：

p{
width: 200px;
height: 100px;
padding: 20px;
margin: 10px;
background-color: #f00;
}

第二题：实现一个水平垂直居中的盒子 使用CSS实现一个宽度为300px，高度为200px的盒子在页面中水平垂直居中。 解决方案：

p{
width: 300px;
height: 200px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: #f00;
}

第三题：实现一个红色圆形按钮 使用CSS实现一个红色圆形按钮，内部有一个白色的加号，鼠标悬停时按钮背景色变为深红色。 解决方案：

p{
width: 100px;
height: 100px;
border-radius: 50%;
background-color: #f00;
display: flex;
justify-content: center;
align-items: center;
color: #fff;
font-size: 40px;
}
p:hover{
background-color: #800;
}

以上是几道常见的CSS习题，通过练习这些题目，大家可以更加深入地理解CSS的基础知识，并能够在工作中更快更准确地解决问题。