css如何设置方形单选按

1、新建一个html文件，命名为test.html，用于讲解。

2、在test.html文件中，使用button标签创建一个按钮。

3、在test.html文件中，设置button标签的class属性为mybtn。

4、在css标签内，通过class定义button的样式，设置它的宽度为50px，高度为50px，实现正方形。

5、在css标签内，再设置在设置忽略按钮的背景颜色为红色，文字颜色为白色，按钮无边框。

6、在浏览器打开test.html文件，查看实现的效果。css是一种用来表现HTML或XML等文件样式的计算机语言，是描述标记语言页面格式的标准。

给按钮添加css样式有以下三种方法：

1，直接在元素上定义style，如下：

<input type="button" style="这里定义样式">

2，页面中内嵌样式，如下：

<style>

    .btn{需要添加的样式}

</style>

<input type="button" class="btn">

3，外部引用css文件，如下：

<link rel="stylesheet" type="text/css" href="这里是css文件的路径">

1、设置一个长度与宽度，使用到的CSS代码。

2、经过给它设置长度与宽度后，变成了下图所示，相比与没有任何样式，它会好出很多。

3、接下来，可以去掉它自带默认的边框，将它边框设置为0PX，观察一下效果。

4、添加了红色的背景后，它显示如下图所示的样式。

5、除了使用颜色设置背景外，也可以使用图片作为背景。

6、还可以设置它的其他更多样式，方法是直接添加CSS代码即可。

---