Common browser kernel (understand)
First explain the browser kernel is something called the English Rendering Engine , many Chinese translation, typesetting engine, explain engine, rendering engine, now called popular browser kernel.
Free to read web content, organize messages, display pages is calculated and displayed page.
The main popular browsers
| Browser | Kernel | Remark |
|---|---|---|
| IE | Trident | IE, cheetah security, 360 speed browser, Baidu browser |
| Firefox | Gecko | In recent years has been the decline, slow to open, upgrade frequently, pig teammate flash, God opponents chrome |
| Safari | webkit | Now many people mistakenly called the chrome of the webkit core, (even chrome kernel is already a blink) |
| chrome | chromeium/blink | In chromeium project development blink rendering engine (ie browser core), built into the chrome browser. Blink branch webkit fact, most of the domestic browsers have adopted blink core, secondary development |
expand
End mobile browser kernel is mainly talking about the system built-in browser kernel
For Android phones, the highest utilization rate is webkit kernel, most of the domestic browser declared their core, they are all basically webkit secondary development.
On iOS and WP7 platform, system reasons, most own browser system kernel, the kernel usually Trident's Safari or IE.
web standards (Key)
网页中 web 标准的三层组成 : 结构 表现 行为
Why follow Web standards
Follow web standards allows us to write different pages more unified standard, there are many advantages
- Let the prospect of a broader web.
- Content can be used by a wider range of devices.
- Make it easier for search engines.
- Reduce the cost of site traffic.
- Make the site easier to maintain.
- Speeds up Web browsing
web standards constitute
Constitution : including the structure (Structure), performance (Presentation), and behavior (Behavior) three.
| standard | Explanation |
|---|---|
| structure | Structure for page elements to sort and classify, as long as the value of the HTML |
| which performed | Plate, color, size, and so the appearance of web pages used to set the style of performance, mainly referring to CSS |
| behavior | Refers to the act of writing the definition and interactive web models, mainly refers to JavaScript |
web standards Summary
- web standard has three layers: the structure, performance and behavior.
- Ideally, they are three separate, placed in different files.
expand
The introduction to your understanding of the browser kernel? Common browser core has what?
Browser kernel consists of two parts, rendering engine and js engines. Web content rendering engine is responsible for reading, sorting messages, calculate and display the Web page display resolution is carried js page, js engine results pages get moving and later increasingly js engine the more independent cores tend to only rendering engine.
IE : Trident
Firefox : Gecko
Safari : webkit
chrome : chromeium / blink
HTML acquaintance
- HTML refers HTML (hyper text markup language) language is used to describe a page
- HTML is not into words, but a markup language (markup language)
Markup Language is a set of markup tags (markup tag)
HTML tags skeleton
<html>
<head>
<title></title>
</head>
<body></body>
</html>HTML tags Categories
Categories:
Conventional elements (double label)
<标签名></标签名>Empty element (single label)
<标签名 />
HTML tags relations
Relationship:
Nested Relations
<head> <title></title> </head>Constellation
<head></head> <body></body>
HTML template
<!-- 声明 文档类型 HTML5 -->
<!DOCTYPE html>
<!-- 声明书写语言 -->
<html lang="zh-CN">
<head>
<!-- 声明编码方式 -->
<meta charset="UTF-8" />
<title></title>
</head>
<body></body>
</html>Common Encoding:
- gb2312: Simplified Chinese
- GBK: Simplified Chinese, Traditional Chinese and Hong Kong, Macao and Taiwan
- UTF-8: all world-class
Common HTML tags
Publishing label
Title Tag (h)
<h1> 标题 </h1>
<h2> 标题 </h2>
<h3> 标题 </h3>
<h4> 标题 </h4>
<h5> 标题 </h5>
<h6> 标题 </h6>Paragraph tag (p)
Semantic role: you can HTML document into several paragraphs
<p> 文本内容 </p>Horizontal label (hr)
<hr />Break tag (br)
<br />div span tag (Key)
div span is no semantic web layout is our two main boxes
<div></div> <span><span>They are two boxes, used to hold our page elements, but they are different
- div tags for layout, but his party can only put a div
- label layout for span, can put a plurality of line span
Text formatting tags
| label | effect |
|---|---|
<b></b> <strong></strong> |
Font bold effect, it is recommended to use strong tags, semantic better |
<i></i> <em></em> |
Text in italics results, an em tag, semantic better |
<s></s> <del></del> |
Text strikethrough effect, it is recommended to use del tag, semantic better |
<u></u> <ins></ins> |
Documents underline effect, recommended ins tag, semantic better |
Tag attributes
<标签名 属性名="属性值1" 属性名="属性值2"><标签名/>
<标签名 属性名="属性值1" 属性名="属性值2" />Image tag img
<img src="图片 URL" />| Attributes | Property Value | description |
|---|---|---|
| alt | text | Pictures can not be displayed when the text is replaced |
| title | text | Content displayed on rollover |
Links tab
<!-- target：
_self：默认值，在当前窗口打开
_blank：为新窗口打开-->
<a href="跳转目标" target="目标窗口的弹出方式">文本对象</a>path
Absolute path
| Category path | symbol | Explanation |
|---|---|---|
| With a path | Only need to enter the name of the image file, <img src = "baidu.jpg />" | |
| Under a Path | / | The image file is in HTML sibling folder, <img src = "images / baidu.jpg />" |
| On a path | ../ | ../ added in front of the file name, if the two, you need to use ../../, and so on, <img src = "../ images / baidu.jpg />" |
Absolute path
Absolute path to the directory path to the root directory of the web site as a reference base. It is called absolute, means that when all the pages referenced by the same file, the path used is the same.
<img src="C:\\admin\Desktop\logo.jpg"Or complete network address, such as " http://www.baidu.com/logo.jpg ."
Note: the relative path with less
expand
Anchor Position
By creating an anchor point connection, users can quickly navigate to the target content
1. 使用 id 名称标注跳转目标的位置 . (找目标)
<h3 id="two">内容1</h3>
2. 使用 <a href="#id名">连接文本</a>创建链接文本(被点击的)base label
You can set the overall base open links style.
write head between the label base
<head> <base target="_blank" /> </head>
Pre preformatted text tags
pre preformatted text tag may be defined. It is enclosed in pre tags this Chinese elements usually reserved spaces and line breaks. The text will be presented as a monospaced font.
<pre>
我是测试内容
</pre>Special characters
| Special characters | description | Character code |
|---|---|---|
| Whitespace | |
|
| < | Less than | < |
| > | more than the | > |
| & | with | & |
| ￥ | Renminbi | ¥ |
| © | copyright | © |
| ® | Trademark | ® |