[历史归档]本文原发布于 cstriker1407.info 个人博客,内容为历史存档,仅供参考。
发布时间:2014-02-10| 标题:html学习备注|分类:编程 / web / html |标签:html
html学习备注
- 什么是 HTML?
- HTML 是用来描述网页的一种语言。
- HTML 标签
- HTML 标记标签通常被称为 HTML 标签 (HTML tag)。
- HTML 文档 = 网页
- HTML 文档描述网页
- HTML 属性
- HTML 标签可以拥有属性。属性提供了有关 HTML 元素的更多的信息。
- 空行和空格
- HTML 块元素
- HTML 内联元素
- HTML <div> 元素
- HTML <span> 元素
- 实例代码:
- 实例效果:
- this is H1
- this is H2
- this is H3
- this is H6
最近想自学一下web开发中需要的各种基础知识,就开始在【 W3school 】上学习各种教程,这里备注下最基本的html笔记。
备注:
部分笔记内容来自【 W3school 】网站,版权归原作者所有。
什么是 HTML?
HTML 是用来描述网页的一种语言。
HTML 指的是超文本标记语言 (Hyper Text Markup Language)
HTML 不是一种编程语言,而是一种标记语言 (markup language)
标记语言是一套标记标签 (markup tag)
HTML 使用标记标签来描述网页
HTML 标签
HTML 标记标签通常被称为 HTML 标签 (HTML tag)。
HTML 标签是由尖括号包围的关键词,比如
HTML 标签通常是成对出现的,比如和
标签对中的第一个标签是开始标签,第二个标签是结束标签
开始和结束标签也被称为开放标签和闭合标签
HTML 标签对大小写不敏感:
等同于
。许多网站都使用大写的 HTML 标签。
W3School 使用的是小写标签,因为万维网联盟(W3C)在 HTML 4 中推荐使用小写,而在未来 (X)HTML 版本中强制使用小写。
HTML 文档 = 网页
HTML 文档描述网页
HTML 文档包含 HTML 标签和纯文本
HTML 文档也被称为网页
HTML 文档是由 HTML 元素定义的。
HTML 属性
HTML 标签可以拥有属性。属性提供了有关 HTML 元素的更多的信息。
属性总是以名称/值对的形式出现,比如:name=“value”。
属性总是在 HTML 元素的开始标签中规定。
始终为属性值加引号
HTML 提示:使用小写属性
属性值应该始终被包括在引号内。双引号是最常用的,不过使用单引号也没有问题。
在某些个别的情况下,比如属性值本身就含有双引号,那么您必须使用单引号,例如:
name='Bill "HelloWorld" Gates'空行和空格
我们无法确定 HTML 被显示的确切效果。屏幕的大小,以及对窗口的调整都可能导致不同的结果。
对于 HTML,您无法通过在 HTML 代码中添加额外的空格或换行来改变输出的效果。
当显示页面时,浏览器会移除源代码中多余的空格和空行。所有连续的空格或空行都会被算作一个空格。需要注意的是,HTML 代码中的所有连续的空行(换行)也被显示为一个空格。
HTML 块元素
大多数 HTML 元素被定义为块级元素或内联元素。
编者注:“块级元素”译为 block level element,“内联元素”译为 inline element。
块级元素在浏览器显示时,通常会以新行来开始(和****结束)。
例子:
,
,
- ,
HTML 内联元素
内联元素在显示时通常不会以新行开始****。
例子:,, ,
HTML元素
HTML
HTML 元素
HTML 元素是内联元素,可用作文本的容器。
元素也没有特定的含义。
当与 CSS 一同使用时, 元素可用于为部分文本设置样式属性。
实例代码:
<!DOCTYPEhtml><html><body>this is body begin;<!--注释:各种标题--><h1>this is H1</h1><h2>this is H2</h2><h3align="center">this is H3</h3><h6>this is H6</h6><!--注释:段落--><p>this is paragraph</p><!--注释:回车换行--><br/><!--注释:超链接--><ahref="http://116.62.110.235/blog">this ia a link</a><br/><ahref="http://116.62.110.235/blog"><imgsrc="http://www.baidu.com/img/bdlogo.gif"/></a><br/><!--注释:使用blank可以在新窗口中打开--><ahref="http://www.w3school.com.cn/"target="_blank">Visit W3School!</a><!--注释:锚点--><aname="tips">基本的注意事项 - 有用的提示</a><ahref="#tips">有用的提示</a><br/><!--注释:图片--><imgsrc="http://www.baidu.com/img/bdlogo.gif"/><!--注释:水平线--><hr/><!--注释:文字效果--><b>This text is bold</b><strong>This text is strong</strong><br/><p>pre 标签很适合显示计算机代码:</p><pre>for i = 1 to 10 print i next i</pre><br/><!--注释:表格--><tableborder="2"><tr><th>title A</th><!-- 表头 --><th>title B</th></tr><tr><td>cell 1,1</td><td>cell 1,2</td></tr><tr><td>cell 2,1</td><td>cell 2,2</td></tr><tr><td> </td><!-- 空格,占位 --><td>cell 3,2</td></tr></table><tableborder="1"><tr><th>姓名</th><td>Bill Gates</td></tr><tr><th>电话</th><td>555 77 854</td></tr><tr><th>电话</th><td>555 77 855</td></tr></table><tableborder="1"><tr><th>姓名</th><thcolspan="2">电话</th></tr><tr><td>Bill Gates</td><td>555 77 854</td><td>555 77 855</td></tr></table><tableborder="1"><tr><th>姓名</th><td>Bill Gates</td></tr><tr><throwspan="2">电话</th><td>555 77 854</td></tr><tr><td>555 77 855</td></tr></table><!--注释:列表--><ul><li>咖啡</li><li>茶</li><li>牛奶</li></ul><ol><li>牛奶</li><ul><li>蒙牛</li><li>伊利</li></ul><li>茶</li></ol><olstart="50"><li>咖啡</li><li>牛奶</li><li>茶</li></ol><!--注释:表单--><form>user:<inputtype="text"name="user"/><br/>passwd:<inputtype="password"name="passwd"/><br/><inputtype="radio"name="sex"value="male"/>Male<br/><inputtype="radio"name="sex"value="female"/>Female<br/><inputtype="checkbox"name="bike"/>I have a bike<br/><inputtype="checkbox"name="car"/>I have a car</form><!--注释:框--><fieldset><legend>title</legend>HelloFieldSet</fieldset><!--注释:内联网页--><iframesrc="http://116.62.110.235/blog"width="200"height="200"></iframe></body></html>实例效果:
this is body begin;
this is H1
this is H2
this is H3
this is H6
this is paragraph
this ia a link
[
](http://116.62.110.235/blog)
Visit W3School! 基本的注意事项 - 有用的提示 有用的提示
This text is boldThis text is strong
pre 标签很适合显示计算机代码:
for i = 1 to 10 print i next i| title A | title B |
|---|---|
| cell 1,1 | cell 1,2 |
| cell 2,1 | cell 2,2 |
| cell 3,2 |
| 姓名 | Bill Gates |
| 电话 | 555 77 854 |
| 电话 | 555 77 855 |
| 姓名 | 电话 | |
|---|---|---|
| Bill Gates | 555 77 854 | 555 77 855 |
| 姓名 | Bill Gates |
| 电话 | 555 77 854 |
| 555 77 855 |
- 咖啡
- 茶
- 牛奶
- 牛奶
- 蒙牛
- 伊利
茶
咖啡
牛奶
茶
user:
passwd:
Male
Female
I have a bike
I have a cartitleHelloFieldSet