zoukankan      html  css  js  c++  java
  • 8.4 H5知识点总结

    HTML简介

    HyperText Markup Language 简称为HTML
    HyperText: 超文本 (文本 + 图片 + 视频 + 音频 + 链接)
    Markup Language: 标记语言
    由SGML(标准通用标记语言)发展而来
    写给浏览器的语言

    HTML的基本结构

    <html>
      <head>
        <title>我的第一个网页</title>
      </head>
      <body>
        欢迎来到HTML世界
      </body>
    </html>
    

     HTML标签元素

    HTML元素由开始标签和结束标签组成。
    位于开始标签和结束标签中的文本是元素的内容。
    HTML 标签有开始必须有结束。如果是没有内容的标签(空标签),用 />来结束。
    标签名推荐用小写。
    标签具有属性, 属性用来表示标签的性质和特征。属性要在开始标签中指定。

    定义一个合格的HTML页面

    <!DOCTYPE html>
    <html>
    <head>
      <meta charset="utf-8">
      <title></title>
    </head>
    <body>
    
    </body>
    </html>
    

     HTML常用元素

    换行符  <br/>

    段落  <p></p>

    标题

    <h1>标题1</h1> 

    <h2>标题2</h2>

    <h3>标题3</h3>

    <h4>标题4</h4>

    <h5>标题5</h5>

    <h6>标题6</h6>

    文本格式化

    <b>定义粗体文本</b>

    <i> 定义斜体文本 </i>

    <del>定义删除文本</del>

    <sup>定义上标字</sup>

    <sub>定义下标字</sub>

    链接

    <a href=“URL”>  </a>

    锚点

    锚点标签用于使用户"跳"到文档的某个部分。

    <a href="#位置名">  </a>

    <a name="位置名">  </a> 

    图像

    <img src="URL" width="" height=""/>

    图片相对地址的定义

    同一目录

    <img src=".jpg" />

    下一层目录

    <img src="images/.jpg"/>

    上一层目录

    <img src="../.jpg"/>

    同一层不同目录

    <img src="../images/.jpg"/>

    图像热区

    <img src="URL"  usemap="# map 名称" />
    
      <map name="map 名称">
    
      <area shape="形状" coords="坐标值" href="URL" />
    
    </map>
    

    HTML实体字符

    实体字符 字符实体
    大于号(>) &gt;
    小于号(<) &lt;
    引号(“) &quot;
    注册商标(®) &reg;
    版权(©) &copy;
    &号 &smp;

     

    无序列表

    <ul>

      <li>……</li>

      <li>……</li>

      <li>……</li>

    </ul>

    有序列表

    <ol>

      <li>……</li>

      <li>……</li>

      <li>……</li>

    </ol>

    HTML表格

    <table border="1">
      <tr>
        <td>row 1, cell 1</td>
        <td>row 1, cell 2</td>
      </tr>
      <tr>
        <td>row 2, cell 1</td>
        <td>row 2, cell 2</td>
      </tr>
    </table>
    

     <iframe>内嵌框架

    <iframe src="url" name="框架名"></iframe>

    form(表单)

    <form name="form1" action="URL" method="get">
      用户名:<input type="text" name="">
      密 码:<input type="password" name="passwd">
    </form>
    
    文本框

    <input type="text" name="username" value="">

    密码框

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

    单选按钮

    <input type="radio"name="sex"value="1"checked="checked">男

    <input type="radio"name="sex"value="0">女

    checked是指默认选项,不需要可以不设置

    复选框

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

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

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

    按钮

    <input type="submit" name="" value="提交">

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

    按钮还可以用图片设置,使视觉性更好一点

    <input type="image"name="" src="图片地址链接">

    隐藏域

    <form action="" method="post" enctype="multipart/form-data">
      <input type="file" name="file">
    </form>
    

     textarea(表单元素:多行文本域)

    <textarea rows="5" cols="50"></textarea>
    

    select(表单元素:下拉框)

    <label for="province">省份</label>
        <select id="province">
        <option>请选择</option>
        <option selected>广东</option>
        <option>上海</option>
     </select>
    

     optgroup(表单元素:下拉框分组)

    <select>
      <optgroup label="热门城市">
        <option>广州</option>
        <option>深圳</option>
        <option>上海</option>
      </optgroup>
      <optgroup label="其他城市">
        <option>AAA</option>
        <option>BBB</option>
        <option>CCC</option>
      </optgroup>
    </select>
    
  • 相关阅读:
    闭包
    this
    函数声明,表达式,构造函数
    算法学习_栈
    LeetCode刷题_140
    2020/3/20 刷题
    2020/3/19 刷题
    2020/3/13_C++实验课
    刷题(主要是DFS) 2020年3月12日
    DFS的一些题2020/3/11
  • 原文地址:https://www.cnblogs.com/tori/p/5739793.html
Copyright © 2011-2022 走看看