WEB前端初学者笔记(2)--基础标签语法以及常见标签


一、HTML基础标签语法

  • HTML 元素以开始标签起始
  • HTML 元素以结束标签终止
  • 元素的内容是开始标签与结束标签之间的内容
  • 某些 HTML 元素具有空内容(empty content)
  • 空元素在开始标签中进行关闭(以开始标签的结束而结束)
  • 大多数 HTML 元素可拥有属性 

 

二、常见标签

1.<div></div>   无实意标签

2.<p></p>    段落标签

3.<span></span>   无实意标签

4.<img src=" ">  图片标签 src后面跟图片地址

5.<ul> </ul> 无序列表标签,里面用且只能用li

使用方法如下:

1 <ul> 
2 <li>aaa</li>
3 <li>bbb</li>
4 <li>ccc</li>
5 </ul>

可以使用  type 改变列表样式(默认为黑圆圈):  type= "square(黑正方体)/ circle(空白圆圈)/ disc(黑圆圈)"-->,list-style: none;去除黑点

6.<ol></ol>有序列表标签

1 <ol>
2 <li>aaa</li>
3 <li>bbb</li>
4 <li>ccc</li>
5 <li>ddd</li>
6 <li>eee</li>
7 </ol>

可以使用  type 改变列表样式(默认为123):  type= "I(罗马数字)/ a(字母表顺序排序)/ 1(阿拉伯数字排序)"-->,list-style: none;去除黑点

7. <input>标签用于搜集用户信息,type定义不同,具体效果也就不同

例如:

 1 <input type="text" name=""> <!-- 文本框 可输入任意东西 -->
 2 <input type="number" name=""><!-- 只能输入数字 e表示科学计数法所以也能输入 -->
 3 <input type="password" name=""><!-- 密码框,默认黑点保护 -->
 4 <br><!-- 换行标签 -->
 5 性别:
 6<input type="radio" name="gender"><!-- 单选框 --><!--name一样代表一个主题下的单选 -->
 7<input type="radio" name="gender"><!-- 单选框 --><!--name一样代表一个主题下的单选 -->
 8 <br><!-- 换行标签 -->
 9 <input type="checkbox" name="gender"><!-- 复选框 --><!-- name一样代表一个主题下的多选 -->
10 <input type="checkbox" name="gender"><!-- 复选框 --><!-- name一样代表一个主题下的多选 -->
11 <input type="checkbox" name="gender"><!-- 复选框 --><!-- name一样代表一个主题下的多选 -->
12 <input type="checkbox" name="gender"><!-- 复选框 --><!-- name一样代表一个主题下的多选 -->
13 <br><!-- 换行标签 -->
button 定义可点击按钮(多数情况下,用于通过 JavaScript 启动脚本)。
checkbox 定义复选框。
file 定义输入字段和 "浏览"按钮,供文件上传。
hidden 定义隐藏的输入字段。
image 定义图像形式的提交按钮。
password 定义密码字段。该字段中的字符被掩码。
radio 定义单选按钮。
reset 定义重置按钮。重置按钮会清除表单中的所有数据。
submit 定义提交按钮。提交按钮会把表单数据发送到服务器。
text 定义单行的输入字段,用户可在其中输入文本。默认宽度为 20 个字符

8.<br>换行标签,换行。

9.<a href=" "></a> 超链接标签  href内写入超链接地址

10.<h1>~<h6>标题标签 共计六级

1 <h1>一级标题</h1>
2 <h2>二级标题</h2>
3 <h3>三级标题</h3>
4 <h4>四级标题</h4>
5 <h5>五级标题</h5>
6 <h6>六级标题</h6>

 

 

 

 

 

 

 

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM