.box { position:relative; width:800px; height:800px; background:#2A363E; } .input { font-size:20px; color:#fff; } .input>input { width:500px; height:50px; font-size:20px; color:#fff; border:2px solid aqua; background:#2A363E; padding:0 10px; } .select { position:absolute; top:70px; left:475px; } .select>ul { background:#0A1824; color:#474F55; width:140px; padding:10px 0; } .select>ul::before { content:""; position:relative; display:inline-block; top:-23px; left:90px; border-bottom:10px solid #0A1824; border-right:10px solid transparent; border-left:10px solid transparent } .select>ul>li { position:relative; list-style-type:none; } .select>ul>li>p { line-height:30px; text-align:center; } .select>ul>li>ul { position:absolute; background:#0A1824; color:#474F55; width:140px; padding:10px 0; left:155px; top:-5px; display:none } .select>ul>li>ul::before { content:""; position:absolute; display:inline-block; top:10px; left:-10px; border-bottom:10px solid transparent; border-top:10px solid transparent; border-right:10px solid #0A1824; } .select>ul>li>ul>li { line-height:30px; text-align:center; list-style-type:none; } .select>ul>li>ul>li:hover { color:aqua; background:#474F55; } .select>ul>li>p:hover { color:aqua; background:#474F55; }
更新时间:2022-10-12 23:28:42