新建一个 HTML 项目
正式开发,我们都建专门的开发目录。现在我们初学,先不用管那么多,直接桌面上建个叫做html
的文件夹就行了。然后把它拖到你最喜爱的编辑器中。
里面再新建一个叫做index.html
的文件。这里的index
不是乱取的,它在程序世界中是有特殊含义的,它表示这是一个网站的首页
。
基本格式
我们刚才说了,HTML
是由标签
组成的,标签
其实就是一些带有尖括号
的英文单词。如果你英文不太好,那也不要紧。HTML
常用的就那么几个常见单词,多写个几次,很快就熟练掌握了。
html 标签
那么我们先来写第一个标签,这个标签的名字,就叫html
。
<html>
</html>
HTML
的最基础格式,就是要有一对html
标签,注意下面这个位置的标签有一个/
。这个/
的意思,表示这个标签结束了。
head 和 body 标签
然后我们再来写其他的标签
。注意下了,其他所有的HTML
标签,都必须写在这一对html
标签中。
<html>
<head>
</head>
<body>
</body>
</html>
好,我们再来认识这两个非常重要的标签了。HTML
就像一个人一样,它分成两个部分,头部(head)
和身体(body)
。
title 标签
头部里面,我们再来放一个叫做title
的标签。它就是整个网站的标题了。
<head>
<title>Hello,各位,我就是标题啊!</title>
</head>
内容
身体里面,我们放点实际内容。
<body>
欢迎你学习HTML哦!
</body>
编码
这样一个基本的HTML
页面就已经做完了,直接双击这个文件打开就行。如果你的页面出现了乱码,在head
中还需要加一点点代码。
<head>
<meta charset="utf-8">
<!-- ... -->
</head>
这个代码的作用,是为了设定浏览器的编码。设定后,浏览器就能正确的显示中文了。现在初学,如果你不懂编码是啥意思,那也先不用管那么多。反正照着东哥的写,总是不会错的?。
观察浏览器
注意看下,我们所书写的title
,显示在了浏览器的标签页这个地方。
而body
中写的内容,就显示到了浏览器主体里。
恭喜你,我们已经一起完成了人生的第一个HTML
页面了。
完成
最终完成的完整代码
<html>
<head>
<!-- 编码一定要写哦,不然中文会乱码! -->
<meta charset="utf-8">
<title>Hello,各位,我就是标题啊!</title>
</head>
<body>
欢迎你学习HTML哦!
</body>
</html>
总结
可以看到,HTML
其实是由各种标签
组成的。
它的结构包括头部(head)
、和身体(body)
,其中头部里网页的一些基础信息,身体部分放网页展现给用户看的具体内容。
那我们来尝试修改下titile
和body
里面的内容,然后重新刷新浏览器,可以看到浏览器中会跟着发生变化。 好了,这一节你学会了吗?学会了就赶紧继续看下一节吧,我们一起来学习更多更好玩的HTML
标签。