我创建了一个网页来控制我的电视(见下图)。当我单击按钮时,服务器会收到 POST 请求并将其转换为 IR 信号。
有用。但是UI看起来很丑。我是网络前端的新手。是否有任何 CSS 库可以使按钮看起来更好,或者与 JS 库有一些动态外观?
顺便说一句,网络服务器托管在 Arduino 上,它有 2K 内存、16MHz CPU 和 30k 闪存。所以没有足够的内存来保存内部 CSS。我希望 html 页面尽可能小。我正在寻找的是我可以链接的 CSS。
2012 年 7 月 23 日更新
我在下面添加了 CSS 代码,按钮看起来像字母,虽然它还不够完美。
button {
display: inline-block;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f1da36), color-stop(100%,#fcf088));
background: -moz-linear-gradient(center top, #f1da36 0%, #fcf088 100%);
-webkit-box-shadow: 0px 0px 5px #777777, 0px 0px 2px #333333 inset;
-moz-box-shadow: 0px 0px 5px #777777, 0px 0px 2px #333333 inset;
box-shadow: 0px 0px 5px #777777, 0px 0px 2px #333333 inset;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
padding: 10px 15px;
border-color: #ffffff;
border-width: 1px;
border-style: solid;
font-size: 16px;
color: #000000;
font-weight: bold;
}
button:hover {
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eeff07), color-stop(100%,#fcf088));
background: -moz-linear-gradient(center top, #eeff07 0%, #fcf088 100%);
}
button:active {
-webkit-box-shadow: 0px 0px 5px #333333 inset;
-moz-box-shadow: 0px 0px 5px #333333 inset;
box-shadow: 0px 0px 5px #333333 inset;
}