【学习笔记】HTML学习笔记

最新推荐文章于 2022-09-16 08:46:14 发布

ic3evil

最新推荐文章于 2022-09-16 08:46:14 发布

阅读量166

点赞数

分类专栏： Web前端文章标签： html 编程 html5 web 浏览器

本文链接：https://blog.csdn.net/ic3evil/article/details/84486920

版权

Web前端专栏收录该内容

1 篇文章 0 订阅

订阅专栏

什么是 HTML？HTML 是用来描述网页的一种语言。

HTML 指的是超文本标记语言 (Hyper Text Markup Language)
HTML 不是一种编程语言，而是一种标记语言 (markup language)
标记语言是一套标记标签 (markup tag)
HTML 使用标记标签来描述网页

HTML 标签HTML 标记标签通常被称为 HTML 标签 (HTML tag)。

HTML 标签是由尖括号包围的关键词，比如 <html>
HTML 标签通常是成对出现的，比如 和 
标签对中的第一个标签是开始标签，第二个标签是结束标签
开始和结束标签也被称为开放标签和闭合标签

HTML 文档 = 网页

HTML 文档描述网页
HTML 文档包含 HTML 标签和纯文本
HTML 文档也被称为网页

Web 浏览器的作用是读取 HTML 文档，并以网页的形式显示出它们。浏览器不会显示 HTML 标签，而是使用标签来解释页面的内容。
下面是做练习的代码：

[code]<!DOCTYPE html>
<html>
<head>
<title>HTML</title>
<meta charset='utf-8'>
</head>
<body>
<address>hello word</address>
<h1><del>This text</del></h1> <ins>contains</ins> 
a line break.
a2 xy
<q>你好</q>
<pre>
int main( )
{
cout<<"I love you"<<endl;
return 0;
}
</pre>

The <abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<ol>
<li>SB
<ul>
<li>ZB</li>
<li>XB</li>
</ul>
</li>
<li>NB</li>
<li>BB</li> <img src="/goon.gif" wdith="200%" height="200%">
<iframe src="http://cnit.pro" wdith="800" height=“800”>
</iframe>
</ol>
<a href="http://www.baidu.com" >百度</a>
</body>
</html>
[/code]

开始分析这段代码：
0x01. 首先要了解相关概念。
0x02. HTML文件结构:

[code]<HTML>
<HEAD>
<title>, <base>, <link>, <isindex>, <meta>
</HEAD>
<BODY>
HTML 文件的正文写在这里... ...
</BODY>
</HTML>
[/code]

0x03.HTML常用的标签：
一般标签的表现形式就是这样的，标签有各种各样的，表示的意义也不一样，本例子里柔和了很多HTML5的标签。
列如：
[code]
 表示换行
段落
[/code]

HTML标签是为了让浏览器知道将内容以什么样的形式输出。（解释）想要显现出什么样的内容就要使用相应的标签，并对标签的属性加以控制，这样你就可以得到你想要的效果。例如表格、超链接、表单、文本框等。

0x04.HTML标签的属性：

[code=] Hellow World![/code]

这段代码中face就是font的属性，赋值为"Arial, Helvetica"。这段代码意思是让客户端的显示出Hellow word!字体为"Arial, Helvetica"。
大多标签都是有属性的，有些自带默认属性。

0x05.HTML中的事件：
事件就是你通过输入设备，让计算机做出响应。例如你点击一下鼠标就弹窗，甚至说一句话让网页显示出你所说的话的内容。（吹吹牛）

使用到的软件：psdpad 或者记事本 IE8浏览器火狐浏览器24.0
相关资料：
http://www.w3school.com.cn/html/
http://zh.html.net/tutorials/

---------------------------------万恶的分割线-------------------------------
本文由ice学习整理，转载请注明出处。
网名：冰神舞文章来源：[url]http://ice5.cn[/url]