前端HTML零基础笔记2 | 青训营笔记

134 阅读1分钟

这是我参与「第四届青训营 」笔记创作活动的的第2天。 为了简单快速地掌握一些基础知识,结合在其他网站的学习了解,对其进行了一系列的整理


1.表单框

 <form></form>   表单框,容器

 <input />   输入框

 type:输入类型
 placeholder:框内提示语
 <span></span>  字节标签:包含文本

   (1)文本输入框
  <input  type = "text"  placeholder =" 请输入账号" />  
   (2)密码输入框
  <input  type = "password"  placeholder =" 请输入密码" />  

实例:
    <span>账号:</span> <input  type = "text"  placeholder =" 请输入账号" />   
    <span>密码:</span> <input  type = "password"  placeholder =" 请输入密码" />   

结果展示: 账号:
密码:


2.单选框

radio(注意:要在同一选择的选项中,使其成为单选,则需要在其后面加上name)
 实例:
 <span>性别:</span> <input  type = "radio"  name =" aa" />  <span></span> 
                    <input  type = "radio"  name =" aa" />  <span></span> 

结果展示: 性别:


3.多选框

  checkbox
  实例:
        <span>兴趣:</span> <input  type = "checkbox"  />  <span>唱歌</span> 
                            <input  type = "checkbox" />  <span>画画</span> 
                            <input  type = "checkbox" />  <span>弹琴</span> 

结果展示: 兴趣: 唱歌 画画 弹琴


4.下拉菜单

<select>
       <option>  内容  < /option>
< /select >

实例:
<span>地区</ span>
   <select>
       <option>  ---请选择所在省份---  < /option>
       <option>   重庆  < /option>
       <option>   广东  < /option>
       <option>   ......  < /option>
   < /select >

5.赋予网址“走向”

<a href = "  网址" >   内容   </a>

实例:
<a href = "http://www.baidu.com">  已同意服务条款   </a>

6.提交按钮

 submit
 value: 改变备注信息
<input type = "submit " value = "内容" />

实例:
<input type = "submit " value = "提交" />

7.重置按钮

rest 
value: 改变备注信息
<input type = " rest " value = "内容" />

实例:
<input type = " rest " value = "重置" />

8.储存地址以及传输方式

action : 传送地址
method : 传输方式,两种: get (不安全); post (加密,安全)

< form  action = "地址" method = "post" >  内容  </ form >

9.表单背景颜色

在body后面添加bgcolor
实例:
<body bgcolor = "色值" >
内容
< / body >

注: 对色值不了解可以到PS中取值,如:#333