使按钮变成失效状态，input框变成只读模式以及其他一些页面控制

最新推荐文章于 2021-09-04 11:34:08 发布

原创最新推荐文章于 2021-09-04 11:34:08 发布 · 1.8k 阅读

CC 4.0 BY-SA版权

1 篇文章

订阅专栏

本文介绍了如何使用HTML和CSS使网页元素变为失效状态、只读模式，并控制文本溢出、字数显示、竖向滚动条及透明背景效果。同时展示了如何创建细边表格和背景透明的输入框。

以下代码可以使按钮变成失效状态
<input id="select-layout" type="button" value="布置图管理" name="select-layout" disabled="disabled">
以下代码可以使input框变成只读且禁用模式
<input name="demo" type="text" disabled value="value" readonly="true" />
CSS控制字数多，隐藏多余字
text-overflow:ellipsis;word-break:keep-all;overflow:hidden; white-space:nowrap;
显示竖的滚动条
overflow-y:auto;height:220px;
//表格不被撑开，换行
style="word-break:break-all"
控制input或者textarea背景透明的样式
background-color: transparent;
实现细边的表格
<table width=500 border="0" align="center" cellpadding="5" cellspacing="1" bgcolor="#add3ef">
<tr bgcolor="#eff3ff">
<td>标题：用户：</td>
</tr>
<tr bgColor="#ffffff">
<td>内容：</td>
</tr>
</table>
或者简单通过这个属性控制
style="border-collapse:collapse"