【01】HTML_day01_02-认识HTML

2021-02-08 作者：匿名阅读：1903次

前言

本文重点解决【01】HTML_day01_02-认识HTML问题,希望能够帮助到你

typora-copy-images-to: media

第01阶段.前端基础.认识HTML

学习目标

理解
- HTML的概念
- HTML标签的分类
- HTML标签的关系
- HTML标签的语义化
应用
- HTML骨架格式
- sublime基本使用

1. HTML 初识

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

pink老师一句话说出html作用:

网页是由网页元素组成的，这些元素是利用html标签描述出来，然后通过浏览器解析，就可以显示给用户了。

所谓超文本，有2层含义：

因为它可以加入图片、声音、动画、多媒体等内容（超越文本限制 ）
不仅如此，它还可以从一个文件跳转到另一个文件，与世界各地主机的文件连接（超级链接文本 ）。

<img src="timg.jpg" />

门外汉眼中的效果页面

我们要做的html页面

html 总结:

html 是超文本标记(标签)语言
我们学习html 主要学习html标签
我们用html标签描述网页元素。比如图片标签、文字标签、链接标签等等
标签有自己的语法规范，所有的html标签都是用 <> 表示的
H（很）T（甜）M（蜜）L（啦）是很快乐的一件事情

1.1 HTML骨架标签

日常生活的书信，我们要遵循共同的约定。

同理：HTML 有自己的语言语法骨架格式：（要遵循，要专业）要求务必非常流畅的默写下来。。

<html>   
    <head>     
        <title></title>
    </head>
    <body>
    </body>
</html>

html骨架标签总结

标签名	定义	说明
	HTML标签	页面中最大的标签，我们成为根标签
	文档的头部	注意在head标签中我们必须要设置的标签是title
	文档的标题	让页面拥有一个属于自己的网页标题
	文档的主体	元素包含文档的所有内容，页面内容基本都是放到body里面的

课堂练习1：

书写我们的第一个HTML 页面。

新建一个 01-html骨架标签的 TXT 文件。
里面写入刚才的HTML 骨架。
把后缀名改为 .HTML。

右击--谷歌浏览器打开。

<html>   
    <head>     
        <title>我的第一个页面</title>
    </head>
    <body>
           你我之间 黑马洗练 月薪过万   一飞冲天   
    </body>
</html>

为了便于记忆，我们请出刚才要辞职回家养猪的二师兄来帮忙，我称之为猪八戒记忆法

团队约定大小写

HTML标签名、类名、标签属性和大部分属性值统一用小写

推荐：

<head>     
        <title>我的第一个页面</title>
 </head>

不推荐：

<HEAD>     
        <TITLE>我的第一个页面</TITLE>
</HEAD>

1.2 HTML元素标签分类

标签：

在HTML页面中，带有“< >”符号的元素被称为HTML标签，如上面提到的 <html>、<head>、<body>都是HTML骨架结构标签。

分类：

常规元素（双标签）

<标签名> 内容 </标签名>   比如 <body>  我是文字  </body>

该语法中“<标签名>”表示该标签的作用开始，一般称为“开始标签（start tag）”，“” 表示该标签的作用结束，一般称为“结束标签（end tag）”。
和开始标签相比，结束标签只是在前面加了一个关闭符“/”。
我们以后接触的基本都是双标签

空元素（单标签）

<标签名 />  比如  <br />

空元素用单标签来表示，简单点说，就是里面不需要包含内容，只有一个开始标签不需要关闭。
这种单身狗标签非常少，一共没多少，我们多记忆就好

pink老师一句话说出他们:

世界上单身狗毕竟是少数的，大部分还是喜欢成双成对，不要拉下你的另外一半，对待一个双标签要有始有终。

1.3 HTML标签关系

主要针对于双标签 的相互关系分为两种：请大家务必熟悉记住这种标签关系，因为后面我们标签嵌套特别多，很容易弄混他们的关系。

嵌套关系

<head>  
    <title> </title> 
</head>

2.并列关系

<head></head>
<body></body>

倡议：

 如果两个标签之间的关系是嵌套关系，子元素最好缩进一个tab键的身位（一个tab是4个空格）。如果是并列关系，最好上下对齐。

pink老师一句话说出他们:

html双标签可以分为有一种是父子级包含关系的标签一种是兄弟级并列关系的标签

1.4 课堂一练

请问下列哪组标签关系是错误的？

[ ]
[ ]
本网刊登的文章均仅代表作者个人观点，并不代表本网立场。文中的论述和观点，敬请读者注意判断。

本文地址：http://www.xlkjgs.com/notes/css/822.html

W 导出为.doc文档

标签标签标记语言关系认识骨架的标签文用一个关

上一篇5分钟让你掌握css3阴影、倒影、渐变小技巧

下一篇css3选择器nth-child(n)和nth-of-type(n)的区别

以上内容由本站整理呈现，请务必在转载分享时注明本文地址！如对内容有疑问，请联系我们，谢谢！

星联网络

星联网络是中国最具实战的互联网创业者的知识服务商，这里有互联网行业动态,网络推广,SEO优化,SEM优化,ESC配置,行业经验分型,互联网项目，微信营销、淘宝客赚钱、新媒体营销、京东运营、跨境电商等众多互联网营销知识分享

源码类型

站长工具

教程-营销

【01】HTML_day01_02-认识HTML

typora-copy-images-to: media

学习目标

1. HTML 初识

1.1 HTML骨架标签

html骨架标签总结

团队约定大小写

1.2 HTML元素标签分类

1.3 HTML标签关系

1.4 课堂一练

给这篇文章的作者打赏

相关内容

星联网络

知识分类

热门推荐

随机文章

标签云

站长运营站长必备网站运营之道才能长久发展

联系我们