HTML输入样式隐藏框但显示内容
时间：2020-03-06 14:53:41 来源:igfitidea点击:
我有一个HTML表单，我们的用户在其中填写数据，然后打印。数据不会保存在任何地方。这些表格来自我们公司外部，并以html页面的形式构建，以尽可能类似于原始页面，然后被填充并遗忘在Intranet上的文件夹中。通常，其他开发人员会执行这些操作，但是我必须在他不在时做一些操作。浏览他的代码，他所有的表单都有一堆服务器端代码来获取输入并仅用内容重写页面。似乎应该有一个更好的方法。
我只想使用媒体选择器设置文本输入的样式，以便在打印时可以看到文本，但周围没有任何框。有什么想法吗？
解决方案
<input type="text" style="border: 0; background-color: #fff;" />
其中#fff是背景色。
假设我们只想从文本中删除边框等，则需要给他们一个类。也许像这样：
<input type="text" class="print-clean" .../>
和css，加载了media =" print"：
<link rel="stylesheet" type="text/css" media="print" href="/css/print.css" />
将包含以下内容：
.print-clean {
border: none;
background: transparent;
}
通过执行以下操作添加单独的CSS文件进行打印：
<link rel="stylsheet" type="text/css" media="print" href="print.css">
将其添加到页面的<head>部分。
在此(print.css)文件中，包括与我们希望在打印页面时看到的内容相关的样式，例如：
在打印时，" input {border：0px}"应该隐藏输入框的边框。
