开篇
我是一名程序员小白，这是我写的第一篇博客，在学习的路上难免会遇到难以解决的问题，我将会在这里写下我遇到的问题并附上解决方法
希望可以对各位有所帮助！！
我们在html中经常会遇到这样的问题
例如：
我们在html中做如图所示的单选按钮的时候，为了页面的美观，往往会使用一张图片去代替
我们可以将该区域设置为一个<li></li>元素
设置li的背景图
但是这样会出现一个新的问题
当我们的图片大小超出这个区域的时候就会变成
只显示了四分之一的图片
显然这不是我们想要的，那么该如何去解决呢？
我们只需要更改我们的background属性设置为
background: url(img/ico_unchecked.png) center/100%;
或者
background: center/100% url(img/ico_unchecked.png);
这样我们的图片就可以变成一张大小合适且居中的图片了
知识点：(以下内容均引用Mdn社区内容)
background :
此属性是一个 简写属性，可以在一次声明中定义一个或多个属性：background-clip、背景-颜色、背景-image、背景-origin、背景-位置、背景-重复、背景-size，和背景-附件。
对于所有简写属性，任何没有被指定的值都会被设定为它们的 初始值。
background属性被指定多个背景层时，使用逗号分隔每个背景层。
每一层的语法如下：
在每一层中，下列的值可以出现 0 次或 1 次：
<attachment>
<bg-image>
<position>
<bg-size>
<repeat-style>
<bg-size> 只能紧接着 <position> 出现，以“/”分割，如： “”.center/80%
<box> 可能出现 0 次、1 次或 2 次。如果出现 1 次，它同时设定背景-origin 和背景-clip。如果出现 2 次，第一次的出现设置背景-origin，第二次的出现设置背景-clip。
< background-color> 只能被包含在最后一层。
备注： background-color 只能在 背景 的最后一个属性上定义，因为整个元素只有一种背景颜色。
background内的属性值的顺序可以随意摆放
！！注意：
<bg-size> 只能紧接着 <position> 出现，以“/”分割，如： “”.center/80%
