一、我们开始先做一个按钮,这便是个一样平常的按钮,假如在xp系统下看,该当会更丑。

图1

图2

html怎么设置按钮样式用CSS 样式做出简略悦目的按钮206 Ruby

二、给它加些样式,直接对button标签加样式。

图3

图4

三、我们再做一个黄色的按钮,只用修正背景色就可以了。

图5

图6

四、用同样的办法再加两个按钮。

图7

图8

<!DOCTYPE html><html lang=\"大众en\"大众><head> <meta charset=\公众UTF-8\"大众> <title>Document</title> <style> button{ border: none; /去掉边框/ padding: 15px 30px; / 内边距来掌握按钮大小 / font-size: 16px; / 字体大小设置 / font-family: Arial, 微软雅黑; / 设置字体类型 / color: white; / 设置字的颜色 / background: #447aa8; / 设置背景色 / border-radius: 3px; / 设置四个角为圆角 / } #bt2{ background:#f90; } #bt3{ background: #363; } #bt4{ background: #333; } </style></head><body> <button>blue按钮</button> <button id=\"大众bt2\"大众>Yellow按钮</button> <button id=\"大众bt3\"大众>Green按钮</button> <button id=\"大众bt4\"大众>Black按钮</button></body></html>