html是什么?
html --> hyperText markup language! 它是这个英文的缩写,翻译过来就是超文本标记语言。这个东西当然是可会可不会的,它的具体前端编程的代码并不相关,但是我希望大家可以多了解一些。
比如有一天,去一个公司面试,HR不懂技术,他问html是什么,你给我解释解释呗,你就得解释啊,解释html是什么。再比如一个不懂技术的外行问你,他肯定什么也不懂,你也得解释啊~所以,会总比不会要好。
简单介绍一下html,html由一对一对的标签组成,每一对标签都有自己特殊的功能和用处。
演示:
移除
html标签
这就是一对标签,前面的叫头标签,后面的叫尾标签,头标签由两个尖括号和一个标签名称组成,尾标签由两个尖括号和一个标签名,以及标签名前的反斜杠(标签结束符)组成。这两个共同组成一对标签。每一个标签都有一个特殊的用法和特殊的含义。
标签代表一定的功能,它还要包裹一定的东西。
这个html标签,我们叫根标签。这个标签是整个html文档的根。再写代码只能写在html标签里。
移除
head 和 body 标签
head就像是头脑,body就像是身体。
body区是给用户看的,head区是给浏览器看的
移除
演示
比如,我们在body区写上一些东西,I just wanna run!!!
我们再看浏览器中
移除
演示
我们怎么在浏览器中看到自己写的代码,很简单:我们可以直接双击保存的html文件,或者直接拖动保存的html文件到浏览器中。
移除
演示在浏览器中打开html文件
再或着,直接在编辑器中右键选择Open in Browser。
这个时候我们在编辑器代码里写一些汉字:
移除
演示,在代码中写汉字
再看代码在浏览器中解释:
移除
点击此处添加图片说明文字
发现现在不太对劲了。后面的中文没有显示出中文。浏览器认不出来中文。那为什么浏览器可以认出英文呢?废话~人家美国人开发的,能不认识英文吗?
这个时候,我们可以意识到代码中缺少了一种可以让浏览器认出中文的东西。
下面我们来添加一下:
移除
添加文字编码的代码
我们注意到不是成对出现的
移除
点击此处添加图片说明文字
移除
点击此处添加图片说明文字
这个时候,我们发现浏览器中可以显示中文了,那么这个标签是什么意思呢。每个标签有自己的属性以及属性值。属性可以直接写,属性值必须加双引号。
那么什么意思呢?它是告诉浏览器,我们的编码格式是utf-8的形式。什么叫编码格式呢?就是浏览器存的字典,让浏览器认识不同的字。
移除
点击此处添加图片说明文字
我们再看一个新的标签,还是在部分的,先看一下效果。
移除
点击此处添加图片说明文字
网页上出现了刚才的名字,我们之前的显示都是lesson1。所以这个标签的作用就是改变网页的名字。
这个时候,可能有人发现,我没有解释上面的lang="en",这段代码,英文好的人,可能会翻译成
language="english".这个绝对不是这个意思。这个涉及seo。我在后期会做一个专题详细解释。
下面我们看一些基础标签:
移除
代码
移除
代码在浏览器中显示
我们来挨个看一下:
标签,又叫段落标签,在浏览器中我们可以看到,它是成段显示的。自成一行。
h1到h6,我们称为标题标签,它可以显示出不同大小的字体。
标签可以起到加粗字体的效果
标签可以让字体显示出斜体的效果
标签可以让字体既加粗又出现斜体效果。当然,这种效果,我们也可以通过上面的 ,这两个标签叠加,显示出来。
总结:介绍html是什么,一些简单的html标签的功能及作用。
本教程持续更新。八月可能出视频教程,欢迎持续关注。
微信公众号:Technikzeit
新浪微博:Net上的小蜘蛛
简书:Net上的小蜘蛛
全平台更新,欢迎关注