HTML输入样式以隐藏框但显示内容

HTML输入样式以隐藏框但显示内容,html,css,printing,Html,Css,Printing,我有一个HTML表单,用户在其中填写数据,然后打印出来。数据没有保存在任何地方。这些表单来自我们公司外部,以html页面的形式构建,尽可能与原始表单相似,然后将其塞进并遗忘在内部网上的一个文件夹中。通常情况下,其他开发人员会执行这些操作,但我必须在他外出时执行一些操作。通过查看他的代码,他的所有表单都有一堆服务器端代码,用于获取输入并仅使用内容重新编写页面。看来应该有更好的办法 我只想使用媒体选择器设置文本输入的样式,这样当它打印时,您可以看到文本,但看不到它周围的框。有什么想法吗? <i

我有一个HTML表单,用户在其中填写数据,然后打印出来。数据没有保存在任何地方。这些表单来自我们公司外部,以html页面的形式构建,尽可能与原始表单相似,然后将其塞进并遗忘在内部网上的一个文件夹中。通常情况下,其他开发人员会执行这些操作,但我必须在他外出时执行一些操作。通过查看他的代码,他的所有表单都有一堆服务器端代码,用于获取输入并仅使用内容重新编写页面。看来应该有更好的办法

我只想使用媒体选择器设置文本输入的样式,这样当它打印时,您可以看到文本,但看不到它周围的框。有什么想法吗?


<input type="text" style="border: 0; background-color: #fff;" />

其中#fff是您的背景色。

假设您只想删除文本中的边框等,您需要给它们一个类。可能是这样的:

<input type="text" class="print-clean" .../>

通过执行以下操作添加单独的CSS文件进行打印:

.print-clean {
    border: none;
    background: transparent;
}
<link rel="stylsheet" type="text/css" media="print" href="print.css">

将其添加到页面的
部分

在此(print.css)文件中,包括与打印页面时希望看到的内容相关的样式,例如:

input{border:0px}
打印时应隐藏输入框的边框

<link rel="stylsheet" type="text/css" media="print" href="print.css">