首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >隐藏框但显示内容的HTML输入样式

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

Stack Overflow用户
提问于 2008-09-29 20:30:54
回答 3查看 33.2K关注 0票数 4

我有一个HTML格式的表单,用户可以在其中填写数据,然后打印出来。数据不会保存在任何地方。这些表单来自我们公司以外的公司,它们被构建为html页面,以便尽可能地与原始表单相似,然后被塞在内联网上的文件夹中并被遗忘。通常会有其他开发人员来做这些工作,但我不得不在他不在的时候做一些工作。浏览一下他的代码,他的所有表单都有一堆服务器端代码,用来接受输入并仅用内容重写页面。似乎应该有更好的方法。

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

EN

回答 3

Stack Overflow用户

回答已采纳

发布于 2008-09-29 20:38:56

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

代码语言:javascript
运行
复制
<link rel="stylsheet" type="text/css" media="print" href="print.css">

将其添加到页面的<head>部分。

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

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

票数 12
EN

Stack Overflow用户

发布于 2008-09-29 20:36:51

假设你只想从文本中移除边框之类的东西,你需要给它们一个类。可能是这样的:

代码语言:javascript
运行
复制
<input type="text" class="print-clean" .../>

和css,加载media=“打印”:

代码语言:javascript
运行
复制
<link rel="stylesheet" type="text/css" media="print" href="/css/print.css" />

将包含类似如下的内容:

代码语言:javascript
运行
复制
.print-clean {
    border: none;
    background: transparent;
}
票数 7
EN

Stack Overflow用户

发布于 2008-09-29 20:33:35

代码语言:javascript
运行
复制
<input type="text" style="border: 0; background-color: #fff;" />

其中#fff是您的背景色。

票数 4
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/150513

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档