html表单和（横向）导航栏

在<form action="xxx.php" mothod="post/get"></form>下面 其中有属性值get是明文传输

<!-- 1输入框 -->

UserName： <input type="text" name="" id="">

<!-- 2.密码框 -->

<input type="password" name="" id="">

<!-- 3.单选框 -->

<input type="radio" name="" id="">

<!-- 4.多选框 -->

<input type="checkbox" name="" id="">

<!-- 5.文本选择 -->

<input type="file" name="" id="">

<!-- 6.提交按钮1 -->

<input type="submit" name="" id="">提交按钮1

<input type="reset" name="" id="">重置

<input type="buuton" name="" id="" οnclick="alert('###被点击了')">点击

<!-- button -->

<button type="button" οnclick="alert('###被点击了')"></button>

<button type="submit" ></button>提交

<button type="reset" ></button>重启

<!-- 8.下拉菜单 -->

​

      

​

<!-- 导航栏 -->

​框架​

1.使用无序列表进行简单排序

​

• <ul><li></li></ul>

​

2.加上样式

将导航栏居中

nav{

       

        text-align:center;

    }

   

ul{

        list-style : none;

        background-color: darkgrey;

        display: inline-flex;

    }

       

        ul li{

    padding:20px;

   

}

li a:hover {

    background-color: darkgreen;

}

1.av 元素的样式设置：

text-align: center;：将 av 元素内的文本内容水平居中显示。
2.ul 元素的样式设置：

list-style: none;：去除了列表项的默认样式，即不显示默认的项目符号。
background-color: darkgrey;：设置背景颜色为深灰色。
display: inline-flex;：将 ul 元素以内联弹性盒子（flexbox）的方式进行显示，即横向排列列表项。
3.ul li 元素的样式设置：

padding: 20px;：设置列表项的内边距为 20 像素。
li a:hover 元素的样式设置：

background-color: darkgreen;：当鼠标悬停在 li 元素内的链接上时，设置背景颜色为深绿色。

active和hovcer的区别

active 是点击显示的颜色而hover是鼠标放在鼠标上后显示颜色