Web前端开发学习Q-Q-U-N：784783012，分享开发工具，零基础，进阶视频教程，希望新手少走弯路。wp是父元素的类名，box是子元素的类名。因为固定宽度和可变宽度是有区别的，这里用size来表示指定的宽度。以下是所有效果要用到的常用代码主要是设置颜色、宽高注意：此常用代码后面不再赘述，只给出相应的提示/*publiccode*/.wp{border:1px纯红色；宽度：300px；height:300px;}.box{背景:绿色;}.box.size{宽度：100px；height:100px;}/*常用代码*/绝对定位的百分比是相对于父元素的宽高，通过这个特性可以让子元素居中显示，但是绝对定位是基于子元素的左上角。想要的效果是子元素的中心显示在中心。为了纠正这个问题，可以使用margin的负值，它可以让元素向反方向移动定位，通过指定子元素的外边距为子元素宽度一半的负值-element，子元素可以居中，css代码如下/*这里是上面的公共代码*//*这里是上面的公共代码*//*定位代码*/.wp{position:relative;}.box{位置：绝对；；顶部：50%；左边：50%；左边距：-50px；margin-top:-50px;}这是我比较常用的方法。这种方式比较容易理解，兼容性好。缺点是需要知道子元素的宽高absolute+marginauto方法还要求居中元素的宽高必须固定。HTML代码如下123123