• 一、HTML语言


    一、概述

    • 全称为HyperText Markup Language,译为超文本标记语言,不是一种编程语言,是一种描述性的标记语言,用于描述超文本中内容的显示方式。比如字体什么颜色,大小等。
    • Html就是超文本标记语言的简写,是最基础的网页语言。
    • Html是通过标签来定义的语言,代码都是由标签所组成。

    二、基本格式

    1 <html>
    2     <head>
    3           <title></title>
    4     </head>
    5     <body></body>
    6 </html> 

    三、HTML的注意事项

    • 多数标签都是有开始标签和结束标签,其中有个别标签因为只有单一功能,或者没有要修饰的内容可以在标签内结束。
    • 想要对被标签修饰的内容进行更丰富的操作,就用到了标签中的属性,通过对属性值的改变,增加了更多的效果选择。
    • 属性与属性值之间用“=”连接,属性值可以用双引号或单引号或者不用引号,一般都会用双引号。或公司规定书写规范。

    四、常用标签

    1. 标题标签(h1 h2 h3 h4 h5 h6)
    2. 水平线标签(hr)
    3. 特殊字符:<  :&lt;           >  : &gt;               &  : &amp;            空格 :&nbsp;
    4. 表格标签: 
       1 <table>
       2    <caption>表格标题</caption><!-- 表头信息 -->
       3    <tr> 
       4        <th>&nbsp</th>  <!-- 定义一个表格头;若是纯文字,默认会以粗体的样式表现 -->
       5      </tr>
       6    <tbody>  <!-- 可以理解为表格的内容区域,在Chrome、FF浏览器通过DOM进行表格动态插入行的时候,要使用这个。如果不进行DOM操作,可不用添加 -->
       7      <tr> <!--定义一个表格行-->
       8           <td>姓名</td>
       9           <td>年龄</td>
      10         </tr>
      11      <tr>
      12           <td>张三</td>
      13           <td>18</td>
      14         </tr>
      15     </tbody>
      16 </table>          
    5. 定义列表(dl标签):<dl><dt></dt><dd></dd></dl>
    6. 有序列表(ol标签):<ol type=“1”> <li></li> </ol>
    7. 无序列表(ul标签):<ul type=“circle”> <li></li>  <ul>           ***type: 空心圆circle 、实心圆disc 、实心方块square ,默认disc
    8. 使用图片(img标签):<img src="../a.jpg"/>  
    9. 超链接(a标签):<a name=“标记”>标记位置</a>    <a href=“#标记”>返回</a>        ***属性target,打开位置
    10. 表单标签(form):表单标签用于与服务器端的交互。
       1 <form enctype="multipart/form-data" action="a.jsp" method="post">
       2     <table>
       3         <tr>
       4             <td><label for="txtname">账号:</label></td>
       5             <td><input type="text" id="txtname" name="username" /></td>
       6         </tr>
       7         <tr>
       8             <td><label for="txtpswd">密码:</label></td>
       9             <td><input type="password" id="txtpswd" name="pswd" /></td>
      10         </tr>
      11         <tr>
      12             <td colspan=2>
      13                 <input type="reset" />
      14                 <input type="submit" />
      15             </td>
      16         </tr>
      17     </table>
      18 </form>

       

      form表单两种提交方式(get和post)的区别:
        **get:from表单里所填的值,附加在action指定的URL后面,做为URL链接而传递。
          **post:from表单里所填的值,附加在HTML Headers上。

          ①数据的查询:比如浏览论坛时,URL一般包含了分类、页码数、每页记录数等信息。 get 方式,能一目了然的看到所要查询的信息(条件)。 post 因为隐藏掉了这些信息,不方便进行检验查询条件。

        ②敏感数据的提交(安全性):对一项记录,进行更改、添加操作时,比如注册用户、更改用户资料等。get 方式附加在URL上,会泄露掉敏感的消息。 post方式,能隐藏掉敏感的信息。

        ③大数据文本传递:get 虽然方便查询,但由于是附加在URL上,各浏览器对URL也有个长度限制。IE :2048字符。Chrome、FF 好像是 8182字符。post 好像没此限制。

    11. HTML的头标签
      头标签都放在<head></head>头部分之间。包括:title base meta link
      <title>:指定浏览器的。
      <base>:为页面上的所有链接规标题栏显示的内容定默认地址或默认目标。(target 属性)
      <meta>:可提供有关页面的基本信息
      <link>:定义文档与外部资源的关系。
    12. 窗口框架(frameset,frame标签)       注意:框架标签不能写在body里面
    13. div和span

      ** div: 自动换行
      ** span:在一行显示

    五、关于页面设计的原则与细节

    • 符合行业要求,色调搭配要求与行业相符。
    • 政府机关:白深蓝、白红
    • 邮政与铁路:白浅绿
    • 广告与传媒:白橘、白红、白黄
    • 医院:白天蓝
    • 艺术行业:黑白、白黑
    • 女性:婚庆?白粉、白红
    • 计算机?白深蓝

    六、补充问题


    1、html乱码问题:

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    2、谷歌浏览器file文件不能相互访问问题:

    限制file协议下脚本的访问权限。本地的HTML文件在浏览器中是通过file协议打开
    的,如果脚本能通过file协议访问到硬盘上其它任意文件,就会出现安全隐患

    3、
    uri : 包括网络有关任何路径(包括邮箱格式)
    * http://www.163.com cc2312@163.com

    url : 指的就是http://www.163.com

  • 相关阅读:
    ping 介绍
    密码学系列——简介密码学
    ActiveMQ c# 系列——进阶实例(三)
    转:LVS简介
    口罩与mask------看东西方文化差异
    Java设计模式之单利模式(Single Pattern)
    Cadence OrCAD Cpature创建Title Block
    终极干货,数组去重且显示每一个数据重复的次数
    LeetCode 64. 最小路径和 | Python
    LeetCode 剑指 Offer 11. 旋转数组的最小数字 | Python
  • 原文地址:https://www.cnblogs.com/drby/p/5527410.html
Copyright © 2020-2023  润新知