请老师帮忙检查

来源:3-30 编程练习

cloudonthesun

2021-05-14 19:50:45

相关代码:

<!DOCTYPE html>
<html>
    <head lang="en">
        <meta charset="UTF-8">
        <title>动态伪类</title>
        <style type="text/css">
            /*此处写代码*/
            form input:hover{
                border:red;
            }
            form input[type="text"]:focus{
                background-color:orange;
            }
            form input[type="password"]:focus{
                background-color:yellow;
            }
        </style>
    </head>
    <body>
        <!-- 此处写代码 -->
        <form action="" method="POST">
            用户名:
            <input type="text">
            <br>
            密码:
            <input type="password">
        </form>
    </body>
</html>

写回答

1回答

好帮手慕久久

2021-05-15

同学你好,鼠标移入input,input边框会消失:

http://img.mukewang.com/climg/609f29ff098e162d04330104.jpg

原因是border属性没有设置边框样式(border-style)导致无法显示边框,建议补全,如下:

http://img.mukewang.com/climg/609f2acb09fdc7eb05280161.jpg

另外,建议把边框宽度也设置上,让页面效果与练习要求一致:

http://img.mukewang.com/climg/609f2b8b096efc1405600172.jpg

关于边框,后面的课程中会讲到,暂且会用即可。

祝学习愉快!

0
hloudonthesun
hp>好的,谢谢老师

h021-05-15
共1条回复

0 学习 · 15276 问题

查看课程