html - 如何使输入元素完全透明?
问题描述
如何使输入元素完全透明,使其具有主体背景图像而不是其父元素的背景颜色?
HTML 代码:
body{
background-image:url("https://upload.wikimedia.org/wikipedia/commons/3/35/Neckertal_20150527-6384.jpg");
}
#wrapper{
background-color: white;
height: 100px;
}
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="wrapper">
<input type="text">
</div>
</body>
</html>
解决方案
添加css如下:
#wrapper > input {
background-color: transparent;
border: none;
}
如果您也想删除焦点边框,请添加:
#wrapper > input:focus {
outline:none;
}
推荐阅读
- c# - C# SQL 协助
- opc-ua - 断开/连接错误后,OPC UA 客户端从 UA 服务器捕获丢失的项目值?
- python - 在python中结合正则表达式
- javascript - 在网页上将地图显示为一系列图像
- r - 如果太接近前一个数据点,则删除时间数据点
- python-3.x - XGBModel' 对象没有属性 'evals_result_'
- kubernetes - Kubernetes/GKE 默认健康探测是否在创建时根据支持服务定义?
- javascript - 名为 export 的 Javascript 导出所有内容,而不仅仅是命名的内容
- tensorflow - CUDA 设备的顺序
- javascript - 每当元素被鼠标悬停时如何显示与数组元素相关的图像