在CSS中,类似Android ICS(冰淇淋般细腻的操作系统)的输入字段可以通过使用伪元素(pseudo-elements)和渐变(gradients)来实现。以下是一个示例代码:
input[type="text"] {
background: linear-gradient(#ffffff, #e0e0e0);
border: 1px solid #bababa;
border-radius: 3px;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
color: #333333;
font-size: 16px;
height: 30px;
padding: 5px;
width: 200px;
}
input[type="text"]:focus {
background: linear-gradient(#f0f0f0, #d0d0d0);
border: 1px solid #999999;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1), 0 0 8px rgba(102, 175, 233, 0.6);
outline: none;
}
这段代码将创建一个类似Android ICS的输入字段,其中包括渐变背景、边框、圆角、阴影和焦点状态下的效果。
推荐的腾讯云相关产品:
产品介绍链接地址:
领取专属 10元无门槛券
手把手带您无忧上云