HTML课堂笔记

最新推荐文章于 2024-06-04 08:13:24 发布

太极生两鱼

最新推荐文章于 2024-06-04 08:13:24 发布

阅读量296

点赞数 1

分类专栏：前端文章标签： html 前端

本文链接：https://blog.csdn.net/qq_45823731/article/details/129150315

版权

前端专栏收录该内容

1 篇文章 0 订阅

订阅专栏

HTML 课堂笔记

文章目录

相关概念
code
- 我的第一个html页面
- 基本标签

相关概念

1、什么是HTML？
Hyper Text Markup Language
超文本标记语言

超文本？超级文本，例如流媒体，声音、视频、图片等。
标记语言？这种语言是由大量的标签组成。

任何一个标签都有开始标签和结束标签，例如：
	<标签>    : 开始标签
	</标签>   : 结束标签

HTML严格意义上来只能说是一种规范，一种浏览器上的规范，
标签语言，不能称为编程语言，因为HTML中没有变量、数据类型
控制语句if 、for，这些都没有的。

2、HTML运行在哪？
运行在浏览器上。

世界五大主流浏览器：
	IE：微软的
	FireFox：火狐（FF）
	Chrome：谷歌
	Opera：欧朋
	Safari：MAC OS专用（苹果专用的浏览器）

国内前端程序员主要安装三个：
	IE
	FF
	Chrome

	前端的程序员开发完成之后需要在不同的浏览器上运行程序，
	以便发现浏览器兼容问题。

3、HTML怎么开发？
新建一个.html或者.htm结尾的文件。
使用记事本打开就能开发，浏览器打开就能运行。不需要编译。

4、什么是web？
web就是网站开发。

5、web程序员包括：

web前端程序员：
	需要精通：html css javascript
	web前端主要负责的是：前端浏览器展示的效果，客户要求：要酷炫、要震撼....

	web前端页面展示的时候，是需要动态的数据的，这些数据是后台java程序或者
	C++程序提供的。

web后台程序员
	需要精通：
		这个不一定了，后台有可能是C语言，也可能是C++，也可能是Java，也可能PHP
		也可能是Python等....

这种系统架构被称为：B/S结构系统。
B: Browser （浏览器）
S: Server （服务器）

6、HTML是哪个组织制定的标准呢？
W3C.
html实际上是w3c制定的一套标准，有不同的版本，例如：HTML4.0、HTML5.0(简称H5)

W3C是一个什么组织呢？
	W3C是World Wide Web Consortium（万维网联盟）的缩写
	tim berners-lee 万维网联盟创始人。万维网之父。（地位等同于爱因斯坦...）

	因为有了他，才有了现如今的互联网时代，他让我们能够上网了。

HTTP协议：超文本传输协议，也是W3C制定的。
HTTP协议是一种什么协议？
	浏览器和web服务器传消息的协议。

7、B/S架构的原理？（粗略的描述一下）

第一步：用户在浏览器地址栏上输入URL。【http://www.baidu.com】

第二步：回车（这一步相当于通过浏览器向服务器发送了一个请求）
	请求：request
	Browser ----> Server（浏览器向服务器发送数据）

第三步：服务器会给浏览器一个响应，最终响应一段HTML代码给浏览器，
浏览器对HTML代码进行执行展示一个结果。
	响应：response
	Server ---> Browser（服务器向浏览器发送数据）


重点：
	到目前为止，浏览器向服务器发送请求有两种方式：
		第一种方式：用户直接在浏览器的地址栏上输入URL，回车。
		第二种方式：用户直接在网页上点击超链接。

		以上两种方式在本质上是没有区别的。
		但是第二种方式更加方便，更加傻瓜式！

code

我的第一个html页面

<!--这是HTML的注释信息-->
<!--这是根-->
<html>

	<!--头-->
	<head>
		<!--标题栏-->
		<title>my first html page</title>
	</head>

	<!--网页体-->
	<body>
		<!--这里的内容显示到网页上！-->
		这是我的第一个HTML页面！
	</body>

</html>

基本标签

<html>
	<head>
		<meta charset="gbk" />
		<title>基本标签</title>
	</head>
	<body>
		<!--段落标记-->
		<p>《黛玉葬花》是文学名著《红楼梦》中的经典片段。林黛玉最怜惜花，觉得花落以后埋在土里最干净，说明她对美有独特的见解。她写了葬花词，以花比喻自己，在《红楼梦》中是最美丽的诗歌之一。贾宝玉和林黛玉在葬花的时候有一段对话，成为《红楼梦》中一场情人之间解除误会的绝唱。</p><p>《黛玉葬花》是文学名著《红楼梦》中的经典片段。林黛玉最怜惜花，觉得花落以后埋在土里最干净，说明她对美有独特的见解。她写了葬花词，以花比喻自己，在《红楼梦》中是最美丽的诗歌之一。贾宝玉和林黛玉在葬花的时候有一段对话，成为《红楼梦》中一场情人之间解除误会的绝唱。《黛玉葬花》是文学名著《红楼梦》中的经典片段。林黛玉最怜惜花，觉得花落以后埋在土里最干净，说明她对美有独特的见解。她写了葬花词，以花比喻自己，在《红楼梦》中是最美丽的诗歌之一。贾宝玉和林黛玉在葬花的时候有一段对话，成为《红楼梦》中一场情人之间解除误会的绝唱。《黛玉葬花》是文学名著《红楼梦》中的经典片段。林黛玉最怜惜花，觉得花落以后埋在土里最干净，说明她对美有独特的见解。她写了葬花词，以花比喻自己，在《红楼梦》中是最美丽的诗歌之一。贾宝玉和林黛玉在葬花的时候有一段对话，成为《红楼梦》中一场情人之间解除误会的绝唱。《黛玉葬花》是文学名著《红楼梦》中的经典片段。林黛玉最怜惜花，觉得花落以后埋在土里最干净，说明她对美有独特的见解。她写了葬花词，以花比喻自己，在《红楼梦》中是最美丽的诗歌之一。贾宝玉和林黛玉在葬花的时候有一段对话，成为《红楼梦》中一场情人之间解除误会的绝唱。</p>

		<!--标题字-->
		<h1>标题字</h1>
		<h2>标题字</h2>
		<h3>标题字</h3>
		<h4>标题字</h4>
		<h5>标题字</h5>
		<h6>标题字</h6>

		<!--换行标记-->
		hello 
		world!
		<!--长了一只眼睛，独目标记-->
		hello<br> world!
		
		<!--水平线，独目标签-->
		<hr>

		<!--color是一个属性，用来指定颜色值-->
		<!--color是属性的名字，red是属性的值-->
		<hr color="red">
		
		<!--HTML中的字符串可以使用单引号，也可以使用双引号-->
		<hr color='red'>
		
		<!--HTML的语法很松散，不严格，去掉单引号双引号也行！-->
		<hr color=green >

		<!--HTML不区分大小写！-->
		<HR>

		<!--预留格式-->
		<!--保留格式，在HTML源码上是什么格式，到网页上还是这个格式，不变。-->
		<pre>
		for(int i = 0; i < 100; i++){
			System.out.println("i = " + i);
		}
		</pre>

		<!--粗体字-->
		<b>粗体字</b>

		<!--斜体字-->
		<i>斜体字</i>

		<ins>插入字</ins>

		<del>删除字</del>

		10<sup>2</sup>

		m<sub>2</sub>

		<!--font字体标签-->
		<!--color是字体颜色，size是字号-->
		<font color="red" size="12">hello world!</font>


		<br><br><br><br><br><br><br><br><br><br>

	</body>
</HTML>