整合营销服务商

电脑端+手机端+微信端=数据同步管理

免费咨询热线:

HTML Unicode(UTF-8)参考手册

nicode 联盟(Unicode Consortium)

Unicode 联盟(Unicode Consortium)开发了 Unicode 标准(Unicode Standard)。他们的目标是使用标准的 Unicode 转换格式(即 UTF,全称 Unicode Transformation Format)取代现有的字符集。

Unicode 标准是一个成功的创举,在 HTML、XML、Java、JavaScript、E-mail、ASP、PHP 中都得到实现。Unicode 标准也得到许多操作系统和所有现代浏览器的支持。

Unicode 联盟与领先的标准开发组织合作,这些组织有 ISO、W3C 和 ECMA。


Unicode 字符集

Unicode 可以由不同的字符集实现。最常用的编码是 UTF-8 和 UTF-16:

字符集描述
UTF-8UTF8 中的字符可以是 1 到 4 字节长。UTF-8 可以代表 Unicode 标准中的任何字符。UTF-8 向后兼容 ASCII。UTF-8 是电子邮件和网页的首选编码。
UTF-1616 位 Unicode 转换格式是一种可变长度的 Unicode 字符编码,能够编码整个 Unicode 指令表。UTF-16 主要用于操作系统和环境,如 Microsoft Windows、Java 和 .NET。

提示:Unicode 的前 128 个字符(与 ASCII 一一对应)使用一个与 ASCII二进制值相同的八位组进行编码,使有效的 ASCII 文本在进行 UTF-8 编码时也是有效的。

提示:所有的 HTML 4 处理器支持 UTF-8,所有的 HTML 5 和 XML 处理器支持 UTF-8 和 UTF-16!


HTML5 标准:Unicode UTF-8

因为 ISO-8859 中字符集大小是有限的,且在多语言环境中不兼容,所以 Unicode 联盟开发了 Unicode 标准。

Unicode 标准覆盖了(几乎)所有的字符、标点符号和符号。

Unicode 使文本的处理、存储和运输,独立于平台和语言。

HTML-5 中默认的字符编码是 UTF-8。

下面列出了一些 HTML5 支持的 UTF-8 字符集:

字符集十进制十六进制
C0 控制与基本的 Latin(C0 Controls and Basic Latin)0-1270000-007F
C1 控制与 Latin-1 的补充(C1 Controls and Latin-1 Supplement)128-2550080-00FF
Latin 扩展 A(Latin Extended-A)256-3830100-017F
Latin 扩展 B(Latin Extended-B)384-5910180-024F

如果 HTML5 网页使用不同于 UTF-8 的字符,则需要在 <meta> 标签中指定,如下:

实例

<meta charset="ISO-8859-1">

如您还有不明白的可以在下面与我留言或是与我探讨QQ群308855039,我们一起飞!

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登录页面</title>
    /*总体的样式*/
    <style>
    	/*盒子样式*/
        #box{
            width: 350px; //宽
            height: 450px; //高
            border: 1px solid black; //边框
            border-radius: 10px; //边框弧度
            font-family: 黑体; //字体
            letter-spacing:8px; //段间距
            word-spacing: 10px; //字间距
            line-height: 40px; //行高
            font-size: 18px; //字大小
            padding: 20px; //内边框
        }
        /*给'注册'赋予样式*/
        .register{
            width:280px ; //宽
            height: 50px; //高
            background-color: skyblue; //背景颜色
            border-radius: 10px; //边框弧度

        }
        /*将所有边框都改变*/
        *{
            border-radius: 5px; 边框弧度
        }
        /*使用class选择器,赋予number宽高和边框*/
        .number{
            width: 185px; //宽
            height: 27px; //高
            border-width: 1px; //边框宽度

        }
        /*id选择器*/
        #two{
            width: 55px; //宽
            border-width: 1px; 边框宽度
        }
        /*id选择器*/
        #phone{
            width: 103px; //宽
        }
        /*class 选择器*/
        .boxs{
            zoom: 75%; //清除浮动
            color: darkgray; //颜色
        }
        /*class选择器*/
        .box_a{
            width: 50px; //宽
            height: 50px; //高
            background-image: url("../image/04.jpg "); //背景图片
            background-repeat: no-repeat; // 是否平铺
            background-size: 50px 25px; //背景尺寸
            position: relative; //定位 相对定位
            left: 310px; //定位后左移
            bottom: 32px; //定位后下移

        }
    </style>
</head>
<body>
<div id="box">
    <h1>请注册</h1>
<p style="color: darkgray">已有帐号?<a href="https://im.qq.com/index">登录</a></p>
<form action="" method="post">
    <label for="name">用户名</label>
    <input type="text" placeholder="请输入用户名" id="name" class="number"> <br>
    <label for="phone">手机号</label>
    <select name="" id="two" class="number">
    <optgroup>
        <option style="" class="">+86</option>
    </optgroup>
    </select>
    <input type="text" placeholder="请输入手机号" id="phone" class="number"> <br>
    <label for="mima">密 码</label>
    <input type="password" placeholder="请输入密码" id="mima" class="number"> <br>
    <label for="mima">验证码</label>
    <input type="password" placeholder="请输入验证码" id="is" class="number">
    <div class="box_a"></div>
    <div class="boxs">
        <input type="radio" id="" class="accept">阅读并接受协议<br>
    </div>
    <input type="submit" value="注册" class="register" >

    </form>
</div>


</body>
</html>
在这里插入图片描述

文档移动到新的位置,我们需要向客户端发送这个新位置时,我们需要用到网页重定向。当然,也可能是为了负载均衡,或者只是为了简单的随机,这些情况都有可能用到网页重定向。

重定向请求到另一个网页的最简单的方式是使用 response 对象的 sendRedirect() 方法。下面是该方法的定义:

public void HttpServletResponse.sendRedirect(String location)throws IOException

该方法把响应连同状态码和新的网页位置发送回浏览器。您也可以通过把 setStatus() 和 setHeader() 方法一起使用来达到同样的效果:

....String site = "http://www.run.com" ;response.setStatus(response.SC_MOVED_TEMPORARILY);response.setHeader("Location", site); ....

实例

本实例显示了 Servlet 如何进行页面重定向到另一个位置:

package com.runoob.test;import java.io.IOException;import javax.servlet.ServletException;import javax.servlet.annotation.WebServlet;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;/**
* Servlet implementation class PageRedirect
*/@WebServlet("/PageRedirect")public class PageRedirect extends HttpServlet{
 public void doGet(HttpServletRequest request,
 HttpServletResponse response)
 throws ServletException, IOException
 {
 // 设置响应内容类型
 response.setContentType("text/html;charset=UTF-8");
 // 要重定向的新位置
 String site = new String("http://www.runoob.com");
 response.setStatus(response.SC_MOVED_TEMPORARILY);
 response.setHeader("Location", site); 
 }}

现在让我们来编译上面的 Servlet,并在 web.xml 文件中创建以下条目:

....
<servlet>
 <servlet-name>PageRedirect</servlet-name>
 <servlet-class>PageRedirect</servlet-class>
</servlet>
<servlet-mapping>
 <servlet-name>PageRedirect</servlet-name>
 <url-pattern>/TomcatTest/PageRedirect</url-pattern>
</servlet-mapping>....

现在通过访问 URL http://localhost:8080/PageRedirect 来调用这个 Servlet。这将把您转到给定的 URL http://www.run.com。