input输入框如何去除边框和修改背景色_html/css_WEB-ITnose

不言
发布: 2018-05-18 17:20:16
原创
11293人浏览过

<body> 
 <table> 
 <tr> 
 <td> 
 <input type="text" value="不如意十八九" > 
 </td> 
 </tr> 
 </table> 
 </body>
登录后复制

因为编辑和预览界面共用一个,考虑使用样式进行区分,上面代码要以下的结果: 

<body> 
 <table> 
 <tr> 
 <td> 
 不如意十八九 
 </td> 
 </tr> 
 </table> 
 </body>
登录后复制

请问各位能否实现 

回复讨论(解决方案)

<input type="text" value="不如意十八九" style="border:0px;">
登录后复制

用css就能实现 
 定义一个class,然后定义边框 none,背景色 
不就好了

<input type="text" style="border:0px;background-color:blue" value="不如意十八九" >
<input type="text" style="border:0px;background-color:blue" value="不如意十八九" >
登录后复制

+1

input{ border-style:none; background-color:#FF9;}
登录后复制

看了下问题,是不是在问JS效果如何实现? 

<body> 
 <table> 
 <tr> 
 <td id="box"> 
 <input type="text" value="不如意十八九" id="myinput" > 
 <button onclick="clicked()">click me</button> 
 </td> 
 </tr> 
 </table> 
 </body> 

------------------ 
<script>function clicked(){
var user_val = document.getElementById("myinput").value;document.getElementById("box").innerHTML = user_val;
}</script>
登录后复制

没有边框都是border:0px;背景色background-color:#fef;

立即学习前端免费学习笔记(深入)”;


 

HTML速学教程(入门课程)
HTML速学教程(入门课程)

HTML怎么学习?HTML怎么入门?HTML在哪学?HTML怎么学才快?不用担心,这里为大家提供了HTML速学教程(入门课程),有需要的小伙伴保存下载就能学习啦!

下载
相关标签:
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
最新问题
开源免费商场系统广告
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号