html常用标签及属性

由于Markdown将文本转换为 HTML，因此在书写html标签时在标签前面加了空格为了正常显示。

< !DOCTYPE html >文档声明标签，告诉浏览器这个页面采取html5版本显示页面
< html lang=”zh=CN” >告诉浏览器页面采用中文显示
< meta charset=”UTF-8” >必须写，采取UTF-8来保存文字，不写就会乱码

1.主体标签

< html >根标签
< head >< title >网页标题< /title >< /haed >
< body >大部分内容都在body中< /body > 
< /html >

2.文字标签

加粗标签：< b >加粗内容< /b >（仅加粗），< strong >加粗内容< /strong >（语气强烈）
倾斜：< i> 倾斜内容< /i>，< em >倾斜内容< /em >
下划线：< u>下划线内容< /u>，< ins>下划线内容< /ins>
删除线(中划线)：< del>删除线内容< /del>,< s>删除线内容
字体：<font color =“颜色单词”size=”1-7之间” face = “字体样式(宋体)，（黑体），，，，”>内容< /font>
ctrl+shift+c调色板
字体变大：< big>内容< /big>
字体变小 ：< small>内容< /small>
上标签：< sup>内容< /sup>
下标签：< sub>内容< /sub>

3.HTML注释

语法：< !–注释内容-- >
标签嵌套：必须有层次的嵌套，不可以有交叉的嵌套

4.排版标签

段落：< p>换行内容（占用单独一行）< /p>
属性 align = “center,left,right”左中右对齐
换行：< br />
横线(分割线，水平线)：< hr />
属性 wideth = “宽度（像素）” size = “线条粗细” color = “颜色” align = “center，right，left”（中右左对齐） noshade（无阴影）
标题标签：h1-h6
< h1>< /h1>最大的
< h2>< /h2>
属性align=”center”…
Div和Span
Div：< div>< /div>块标签（独占一行）
Span：< span>< span>行（内）标签（可以和别的内容放在一行）
注意：块元素可以设置宽高，行元素不可以设置宽高

5.列表标签

有序列表
语法：Ol，li

< ol>
< li>内容1< /li>
< li>内容2< /li>
....
< /ol>

属性：type：1，a，A，i，I，none
start：起始位置=“1，2，3…”

无序列表

< ul>
< li>列表项1< /li>
< li>列表项2< /li>
< li>列表项3< /li>
< li>列表项4< /li>
< li>列表项5< /li>

< /ul>

1.无序列表各个列表项之间无序
2.< ul>< /ul>中只能嵌套

• 标签
  3.< li>< /li>中什么都能放
  4.无序列表会自带样式属性

  自定义列表
  用于对名词进行解释和说明

  < dl>
  < dt>名词1< /dt>
  < dd>名词1解释1< /dd>
  < dd>名词1解释2< /dd>
  ...
  

  < /dl>

  6.图像标签

  < img src=”图像URL”/>
  src:图像标签的必须属性，指定图片的路径和文件名
  

  7.超链接标签

  < a href=”跳转目标” target=”目标窗口的弹出方式”>文本或图像< /a>
  
  1.外部链接前要加http://
  _self:当前页面打开(默认值)
  _blank:新窗口打开
  2.内部链接：网站内部页面之间相互连接
  3.直接链接内部页面的名称即可
  4.下载链接：如果href里面地址是一个文件或者压缩包，则会下载这个文件
  5.网页元素链接：在网页中的各种元素，如文本，表格，图像，音频，视频等都可以添加超链接。
  6.锚点链接：点击链接可以快速定位到页面中的某个位置
  在链接文本的href属性中，设置属性值为“#名字”的形式，如< a href=”#two”>第二集< /a>
  找到目标位置标签，在里面加一个id属性=刚才的名字，如：< h3 id=”two”>第二季介绍< /h3>

  8.特殊字符

  

  9.表格标签

  1.表格的主要用于展示数据
  2.基本语法

  < table>
  < tr>
  < td>单元格内的文字< td>
  ...
  < /tr>
  ...
  < /table>
  

  table:用于定义表格的标签
  tr：用于定义表格中的行，必须嵌套在table中
  td:用于定义表格中的单元格必须嵌套在tr中
  th:表头单元格标签（table head）表头单元格中的文字会加粗并居中显示
  
  表头放在< thead>< /thead>中，表主体放在< tbody>< /body>中
  合并单元格：
  跨行合并：rowspan=“合并单元的个数”
  跨列合并：colspan=“合并单元的个数”

  10.表单标签

  用于网页中的表单显示
  在html中，一个完整的表单通常由表单域，表单控件（也称表单元素），和提示信息三部分组成。
  表单域：< form >标签，实现用户信息的收集和传递。
  < form>会把它范围内的表单元素提示信息交给服务器。
  
  语法规范：
  < form action=”url地址” method=”提交方式” name=”表单域名称”>
  各种表单元素控件
  < /form>.
  表单控件
  在表单域中可以定义各种表单元素，这些元素就是允许用户在表单中输入或者选择的内容控件。

  1.input:输入表单元素(单标签)

  收集用户信息
  < input type=”属性值” />设置不同的属性值来指定不同的控件类型
  
  name和value都必须有值
  < lableb>标签为input元素定义注释
  lable标签可以绑定一个表单元素，当点击< lable>标签内的文本时，浏览器就会自动将焦点转到或者选择对应的表单元素上，用来增加用户体验。

  2.select:下拉表单元素

  < select>
  < option>选项1< /option>
  < option>选项2< /option>
  < option>选项3< /option>
  < option>选项4< /option>
  < option>选项5< /option>
  < /select>
  

  3.textarea:文本域元素

  当用户输入文字比较多时，我们就不能使用文本框表单了，此时我们可以使用< textarea>标签。在表单元素中，< textarea>标签是用于定义多行文本的控件