网页乱码的问题是如何产生的?怎样解决?
首先认识几种编码方式
- ASCII
American Standard Code for Information Interchange(美国信息交换代码),是基于拉丁字母的一套电脑编码系统,为美国英语通信所设计。它由128个字符组成,包括大小写字母、数字0-9、标点符号、非打印字符(换行符、制表符等4个)以及控制字符(退格、响铃等)组成,每个字符占7位(1字节是8位)。它主要用于显示现代英语,而其扩展版本EASCII则可以部分支持其他西欧语言,并等同于国际标准ISO/IEC 646。
- ISO Latin-1
ISO/IEC 8859-1,正式编号为ISO/IEC 8859-1:1998,又称Latin-1或“西欧语言”,是国际标准化组织内ISO/IEC 8859的第一个8位字符集。它以ASCII为基础,加入96个字母及符号,藉以供使用附加符号的拉丁字母语言使用。可以认为ASCII是美国发明针对英语设计的,但欧洲人在用的时候出现了问题。对于一些特殊的拉丁字符,比如法文德文里某些字符,ASCII字符集就不包括。于是欧洲人发明了一种8位字符集是ISO 8859-1 Latin 1,也简称为ISO Latin-1。它对ASCII做了个扩充,对于0-127之间的字符还使用ASCII里的字符不变, 把位于128-255之间的字符(也就是空置的0xA0-0xFF的范围内的字符)表示拉丁字母表中特殊语言字符。
- Unicode
Unicode(中文:万国码、国际码、统一码、单一码)是计算机科学领域里的一项业界标准。它对世界上大部分的文字系统进行了整理、编码,使得电脑可以用更为简单的方式来呈现和处理文字。Unicode的实现方式不同于编码方式。一个字符的Unicode编码是确定的。但是在实际传输过程中,由于不同系统平台的设计不一定一致,以及出于节省空间的目的,对Unicode编码的实现方式有所不同。Unicode的实现方式称为Unicode转换格式(Unicode Transformation Format,简称为UTF)。
- UTF-8
UTF-8(8-bit Unicode Transformation Format)是一种针对Unicode的可变长度字符编码,也是一种前缀码。它可以用来表示Unicode标准中的任何字符,且其编码中的第一个字节仍与ASCII兼容,这使得原来处理ASCII字符的软件无须或只须做少部分修改,即可继续使用。因此,它逐渐成为电子邮件、网页及其他存储或发送文字的应用中,优先采用的编码。
- GBK
汉字内码扩展规范,称GBK,全名为《汉字内码扩展规范(GBK)》1.0版。用2个字节来表示一个汉字,总共可以覆盖2万多个文字。英文保留和UTF-8同样的方式使用一个字节来表示。
- UNICODE只是给字符一个代号,而GBK和UTF-8使用不同的规则来表示同一个代号。
网页乱码的问题是如何产生的?
我们使用编辑器进行编辑后保存的的编码格式和浏览器的解码格式不匹配,从而产生乱码。(即使编码方式和解码方式不一致,纯粹的英文也不会出现乱码问题。因为utf-8、gbk对英文都是采用1个字节的编码方式,并且使用了相同的码字。)
网页乱码的问题怎样解决?
直接告知浏览器通过指定的方式解码。如果文件保存为utf-8格式,那么一定要在html的<head>
里添加<meta charset="utf-8">
。同理,如果文件保存为gbk格式,一定要在文件里添加<meta charset="gbk">
。
颜色有几种写法,红色、绿色、蓝色、白色、黑色如何表示?透明黑色如何表示?#ccc的颜色,#eee的颜色?#333的颜色?
-
颜色有几种写法?
- 色彩关键字
使用名称来表述颜色,例如 red, blue, brown, lightseagreen等 - rgb()
- 十六进制符号 #RRGGBB 和 #RGB
三位数的RGB符号(#RGB)和六位数的形式(#RRGGBB)是相等的。例如,#f03 和 #ff0033 代表同样的颜色。 - 函数符 rgb(R,G,B)
rgb后跟3个<integer>
(整数)或3个<percentage>
(百分比)值。
整数255相当于100%,和十六进制符号里的 F 或 FF 。
- 十六进制符号 #RRGGBB 和 #RGB
- hsl()
Hue-saturation-lightness(色相-饱和度-明度)模式。- 色相(H)表示色环(即代表彩虹的一个圆环)的一个角度。这个角度作为一个无单位的
<number>
(整数)给出。定义 red=0=360,其它颜色分散于圆环,所以 green=120, blue=240,以此类推。作为一个角度,它隐含像 -120=240 和 480=120 这样的回环。 - 饱和度(s)和明度(l)由百分数来表示。
100% 是满饱和度,而 0% 是一种灰度。
100% 明度是白色, 0% 明度是黑色,而 50% 明度是“一般的”。
- 色相(H)表示色环(即代表彩虹的一个圆环)的一个角度。这个角度作为一个无单位的
- rgba() & hsla()
rgba & hsla 扩展了 rgb & hsl 的颜色模式。在 rgb & hsl 基础上增加了阿尔法通道来设定颜色的透明度。
a 表示透明度(a取值0~1):0=透明;1=不透明
- 色彩关键字
红色、 绿色、蓝色、白色、黑色如何表示?
颜色 | 色彩关键字 | rgb | hsl |
---|---|---|---|
红色 | red | rgb(255,0,0) #FF0000 | hsl(0,100%,50%) |
绿色 | green | rgb(0,255,0) #00FF00 | hsl(120,100%,25%) |
蓝色 | blue | rgb(0,0,255) #0000FF | hsl(240,100%,50%) |
白色 | white | rgb(255,255,255) #FFFFFF | hsl(0,0%,100%) |
黑色 | black | rgb(0,0,0) #000000 | hsl(0,0%,0%) |
- 透明黑色如何表示?
颜色 | rgba | hsla |
---|---|---|
透明黑色 | rgb(0%,0%,0%,0.6) | hsl(0,0%,0%,0.6) |
此透明黑色的alpha值(透明度)为0.6,也就是为40%的透明。
-
#ccc
、#eee
、#333
的颜色?-
#ccc
表示浅灰色 -
#eee
表示灰色 -
#333
表示深灰色
-
<!doctype html>
的作用是什么?
文档声明,让浏览器按w3c所规定的html5标准渲染这个页面。
严格模式和混杂模式指什么?
- 严格模式是指在编辑时有声明
<!doctype>
,浏览器进行解码时,按照此声明的规范来呈现页面。 - 混杂模式是指在编辑时没有声明
<!doctype>
,浏览器按照自己的默认方式解码来呈现页面。
meta
有什么作用,常见的值有哪些?
-
meta
的定义和用法
<meta>
元素可提供有关页面的元信息(meta-information),比如针对搜索引擎和更新频度的描述和关键词。
<meta>
标签位于文档的头部,不包含任何内容。<meta>
标签的属性定义了与文档相关联的名称/值对。
-
<meta>
是用来在HTML文档中模拟HTTP协议的响应头报文,它提供用户不可见的信息。<meta>
标签用于网页的<head>
与</head>
中。 -
<meta>
标签的用处很多- 通常用来为搜索引擎robots定义页面主题,或者是定义用户浏览器上的cookie;
- 它可以用于鉴别作者,设定页面格式,标注内容提要和关键字;
- 还可以设置页面使其可以根据你定义的时间间隔刷新自己,以及设置RASC内容等级,等等。
-
<meta>
常见的属性和值
必需的属性和值
属性 | 值 | 描述 |
---|---|---|
content |
some_text | 定义与http-equiv 或name 属性相关的元信息 |
可选的属性和值
属性 | 值 | 描述 |
---|---|---|
http-equiv |
content-type expires refresh set-cookie |
把content 属性关联到 HTTP 头部 |
name |
author description keywords generator revised others |
把content 属性关联到一个名称 |
scheme |
some_text | 定义用于翻译content 属性值的格式 |
<meta http-equiv="X-UA-compatible"content="IE=edge,chrome=1"
有什么作用?
强制浏览器按照最新的标准去渲染,而chrome=1
将允许站点在使用了谷歌浏览器内嵌框架(Chrome Frame)的客户端渲染,对于没有使用的,则没有任何影响。
X-UA-Compatible
是针对 IE8 版本的一个特殊文件头标记,用于为 IE8 指定不同的页面渲染模式,对于ie8之外的浏览器是不识别的。
常见的浏览器有哪些,什么内核?
浏览器 | 内核 |
---|---|
Chrome | WebKit(Chromium)>Blink |
Safari | WebKit |
IE | Trident |
Firefox | Gecko |
Opera | Presto>WebKit(Chromium)>Blink |
360、QQ | Webkit+Trident |
Copyright:版权归饥人谷及本人所有,转载须说明来源。