html学习历程(一)

html全称超文本标记语言(Hyper Text Markup Language),标准通用标记语言下的一个应用。HTML 不是一种编程语言,而是一种标记语言 (markup language),是网页制作所必备的。“超文本”就是指页面内可以包含图片、链接,甚至音乐、程序等非文字元素。超文本标记语言的结构包括“头”部分(英语:Head)、和“主体”部分(英语:Body),其中“头”部提供关于网页的信息,“主体”部分提供网页的具体内容。
html编辑器我使用的是Notepad++,主要是因为这个软件可以看很多种代码,用起来比较习惯。
首先在Notepad++中新建一个文件,然后开始可以编写代码
这里我先用一个例子来说一下html的代码的结构

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>	my first html</title>
	</head>
	<body>
		<h1>
			my first html file
		</h1>
		<a href="https://blog.csdn.net/marwi_study">我的博客</a>
		<br/>
		<p>
			hello world!
		</p>
		<img src="1.jpg" width=1200 height=900/>
		<!--注释(不显示)图片可以使用相对路径,这里是同一目录下,也可以用绝对路径-->
	</body>
</html>

<!DOCTYPE html>声明这个html文件是html5文档
由于是一门标记语言,所以html用到了很多标签,每个标签有一个开始标签和一个结束标签,开始标签就像<html>结束标签是在开始标签的基础上加一个/,即<html>的结束标签为</html>html的代码就是建立在标签之上的,每个标签叫做一个元素。其中<html>是html页面的根元素,超文本标记语言的结构包括“头”部分(英语:Head)、和“主体”部分(英语:Body),其中“头”部提供关于网页的信息,“主体”部分提供网页的具体内容。所以在<html></html>之间有<head>和<body>这两个元素
<head></head>中是用来定义网页的信息的,我们这里的<meta charset="utf-8">是指定网页的编码方式是utf-8,也就是支持中文的网页,如果没有这一句,中文字符在编写出来的html中可能会出现乱码,<title> my first html</title>是定义网页标题的

<body></body>中是用来定义网页主体的,其中<h1>~<h6>是用来定义标题的,有六层标题,就像我们在写文档时会有一些小标题一样,主要是字体的大小不同,h1最大,然后依次递减。<a>标签是用来声明链接的,其中的href是链接的地址,在<a></a>之间的内容是显示在网页上带有链接的文字内容;<br/>是一个空元素,其作用是换行;<p>标签用来显示文章的段落;<img>用来显示图片,其中src是图片的路径,可以是相对路径也可以是绝对路径,我这里用的是相对路径,图片与该html文件同目录;html中的注释是用<!--注释内容-->,在其中的内容不会显示在网页上,但是可以提高代码的可读性。为了可读性更强,最好在编写的时候多使用缩进,这样可以让层次结构更清晰。

在这里插入图片描述
然后另存为html格式
在这里插入图片描述
当保存为html文件后标签什么的会用不同颜色显示,这样看起来也比较方便
在这里插入图片描述
然后打开保存下来的html文件就可以看到下面的界面
在这里插入图片描述

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值