css中input表单focus兄弟触发失效问题

由于input标签是单标签, 其中不能插入其他元素标签及类型, 因此,对于input中需要进行的focus触发, 只能对兄弟进行,
但在实际的操作中, 有时会出现focus触发失效的情况,

经过多次实验得出结果:
表单focus触发其他兄弟标签时, 其要触发的兄弟标签必须在其标签的下一位(必须在下一位相邻, 两个兄弟标签中间不能有其他标签存在, 方能成功执行)

例如:

css中

/*input:focus特性, 对于兄弟标签, 只能让相邻的兄弟做出回应(必须紧邻这下一个, 隔一个位都不行)*/
/*这里设置一个div.select-what用于包着以内三个属性, 以便于它们可以同时做出反应*/
.select-what {
	visibility: hidden;
}

html中

			<input type="select" placeholder="谁**买小米儿" id="only-one-input"/>
			<div class="select-what">
				<div class="select-input-up-left"></div>
				<div class="select-input-up-right"></div>
				<div class="select-input">
					<p>全部商品</p>
					<p>红米</p>
					<p>手机</p>
					<p>冰箱</p>
					<p>洗衣机</p>
					<p>电视</p>
				</div>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值