HTML

目录

单双标签

标签的属性

文本标签

链接标签

图像标签

表格标签

列表标签

区块元素

label标签

表单标签

fieldset标签

---

标签的基本格式

单双标签

       标签中有文本或者子标签,一般是双标签

       标签中的内容来自一个外部资源,一般是单标签

标签的属性

       基本格式  属性名=”值” eg: id=”name”

       基本属性  id  title  width  height

文本标签

       标题标签 eg: <h1></h1>  最多<h6>

       分割标签 eq: <hr />

       段落标签 eq: <p></p>

       换行标签 eq: <br />

       粗体标签 eq: <strong> </strong>

       斜体标签 eq: <em> </em>

       预格式文本标签 eq: <pre> </pre>

链接标签

       <a href=https://www.baidu.com target=”_blank”>百度一下</a>

              href: 网址

              target: “_blank”>新的窗口打开 , “_self”>当前窗口打开(默认) , “_parent”>父窗口打开 , “_top”>最顶层的窗口打开

              target=”” 内容为iframe标签的name值时则为在iframe中打开链接

图像标签

       <img src=”../images/9.png” alt=”” name=””>

              src: 设置图片路径

              alt: 图片无法加载则显示alt提示信息

              name: 鼠标放上去的提示

表格标签

       <table> </table>

1. 创建表格使用的是table标签
2. 创建表格先写行再写列
3. 用户的数据都保存在单元格中
4. table下的子标签 <tr>行 , <td>列 , <th>单元格用在表头
5. 表格标题<caption></caption>

属性

       border=”1” 边框

       cellspacing=”0” 单元格外间距

       cellpadding=”5”  单元格内边距

       align=”center” 对齐方式

子标签

       <colgroup span=”1”>: 列控制

              span=1: 控制一列

       <colgroup span=”2”>

              <col bgcolor=”” />

              <col bgcolor=”” />

       </colgrpunp>

表格单元格的合并

       横向合并 <td colspan=”2”></th>

       纵向合并 <td rowspan=”2”></th>

列表标签

       无序列表 <ul></ul>

              去除小黑点: type=”none”

       有序列表 <ol></ol>

       自定义列表 <dl>主体  <dt>标题  <dd>内容

              <dl>

                     <dt></dt>

                     <dd></dd>

                     <dt></dt>

                     <dd></dd>

              </dl>

区块元素

       div: 块元素,自动占据一整行,可设置宽高

       span: 内联元素.不可设置宽高.宽高由内容决定

       行内块转换: display: “block”>块 , “inline”>行内 , “inline-block”>行内块

label标签

       <label for=”x”> xx </label> 焦点转移到id=”x”的标签上

表单标签

       required=’’ 必填选项

       <form action=”a.php” method=”get”></form>

              action=”a.php” 提交到a.php

              method=”get”      get:所有数据都在url地址上,不安全且数量有限

                                          post:所有的数据都在请求头中,安全且数量很大

       <input type=”text” name=”” value=”” placeholder=””>

              type=”text”>文本框 , “password”>密码框

              name=”” 名

              value=”” 值

              placeholder=”” 提示

       <input type=”radio” name=”” value=”” checked>

              type=“radio”>单选按钮 , “checkbox”>多选按钮

              name=”” 同一组的按钮必须相同,多选的为数组

              value=”” 同一组的值不能相同

              checked  此表示默认选中

       <select name=””> 下拉框

              <option value=””> <option>

              <option value=”” selected> <option>

       </select>

       <input type=”file” name=”” accept=””>文件上传域

              accept=”” 地址

       <textarea name=”” rows=”5” cols=”40”></textarea> 文本域

              rows=”5” 行

              cols=”40” 列

       <input type=”submit” name=”” value=””>提交按钮

              name=”” 名

              value=”” 显示

       <input type=”reset” name=”” value=””> 充值按钮

fieldset标签

       <fieldset>

              <legend align=”center”>  </legend>

       </fieldset>

      

框架

<iframe src=”http” width=”” height=”” frameborder=”0” name=”” scrolling=”no” seamless><iframe>

frameborder=”0” 取消边框

name=””

scrolling=”no” 取消滚动条

       seamless 看起来像是文档的一部分

       src可以改为srcdoc 改了之后则变为 可插入HTML代码