计算器样式

麻辣五花肉

已于 2022-03-10 16:39:07 修改

阅读量249

点赞数 2

文章标签： elementui sass fpga开发

于 2022-03-10 16:37:15 首次发布

本文链接：https://blog.csdn.net/Clear_Wines/article/details/123405163

版权

<table style="text-align: center;background-color: darkslategrey;" align="center" border="1px" cellspacing="10px">
			
			<tr>
				<td colspan="4"><input value="0" type="text"></td>
			</tr>
			<tr>
				<td><button type="button" id="b5">存储</button></td>
				<td><button type="button" id="b5">存取</button></td>
				<td><button type="button" id="b4">删除</button></td>
				<td><button type="button" id="b4">清屏</button></td>
			</tr>
			<tr>
				<td><button type="button" id="b5">累存</button></td>
				<td><button type="button" id="b5">积存</button></td>
				<td><button type="button" id="b5">清存</button></td>
				<td><button type="button" id="b1">÷</button></td>
			</tr>
			<tr>
				<td><button type="button" id="b3">7</button></td>
				<td><button type="button" id="b3">8</button></td>
				<td><button type="button" id="b3">9</button></td>
				<td><button type="button" id="b1">×</button></td>
			</tr>
			<tr>
				<td><button type="button" id="b3">4</button></td>
				<td><button type="button" id="b3">5</button></td>
				<td><button type="button" id="b3">6</button></td>
				<td><button type="button" id="b1">-</button></td>
			</tr>
			<tr>
				<td><button type="button" id="b3">1</button></td>
				<td><button type="button" id="b3">2</button></td>
				<td><button type="button" id="b3">3</button></td>
				<td><button type="button" id="b1">+</button></td>
			</tr>
			<tr>
				<td><button type="button" id="b3">0</button></td>
				<td><button type="button" id="b3">.</button></td>
				<td><button type="button" id="b3">+/-</button></td>
				<td><button type="button" id="b2">=</button></td>
			</tr>
			
		</table>

<style type="text/css">
			button{
				width: 100%;
				height: 100%;
				color: #fff;
				font-size: 40px;
			}
			input{
				width: 98%;
				font-size: 40px;
				text-align: right;
			}
			#b1{
				background-color: brown;
			}
			#b2{
				background-color: orangered;
			}
			#b3{
				background-color: blue;
			}
			#b4{
				background-color: #000000;
			}
			#b5{
				background-color: #5F9EA0;
			}
		</style>