一、HTML简介
1.HTML是什么?
HTML:Hyper Text Markup Language超文本标记(标签)语言
由多种标签组成,用来制作网页,告别浏览器该如何显示网页
2.HTML语言的作用?
制作网页,控制网页和内容的显示
插入图片、音乐、视频、动画等多媒体
通过链接检索信息
使用表单获取用户信息,实现交互
3.版本
W3C:World wide web consortium万维网联盟,制定WEB技术相关标准和规范的组织,HTML就是由w3c制定的标准
两个版本:HTML4.0和HTML5.0
官网:https://www.w3chool.com.cn/
4.HTML后缀名----扩展名
HTML文件的扩展名 是以.html或.htm来结尾
二、HTML文档的基本结构
1.基本结构
1.1简介
HTML标签是由尖括号括起来的关键词,如,通常都是成对出现的,如
以为根标签,包含
头部和主体部分头部提供关于网页的相关信息,如标题、字符编码、文档类型、关键词等摘要信息
主体部分提供网页的具体内容,真正显示在页面中
合理的进行缩进
标签名不区分大小写,但一般习惯用小写
案例1:
案例2:
案例3:
1.2开发工具
记事本notepad, sublime, notepad ,Dreamweaver, VScode, Webstorm等
使用步骤:
1.新建文件(Ctrl N),然后保存(Ctrl S),指定扩展名为.hmtl (代码无颜色提示)
2.缩写HTML文件
3.在浏览器中打开
使用技巧:
先保存再编写代码,否则没有颜色提示
建议创建一个文件夹,用于保存所有的网页内容,讲文件夹拖拽到subllime中打开,便于管理
显示/隐藏侧边栏
方式一:查看–>侧边栏–>显示/隐藏侧边栏
方式二:Ctrl K再按B
显示多栏
方式一:查看–>布局–>列数,2列
方式二:alt shift 2
案例4:
1.3浏览器
常见浏览器:IE浏览器 Chrome谷歌 Firefox火狐 Safari
浏览器的作用就是来读取html文件,并以网页的形式进行显示
浏览器不会是直接显示html标签,而是使用标签
2.标签
2.1标签的组成
一个完整的html标签的组成:
内容标签名>
标签html从入门到精通!
属性值要用引导引起来,一般用双引号
2.2标签的分类
根据标签是否关闭,分为:关闭型,非关闭型
关闭型标签:有开始标签也有结束标签,即标签成对出现
1
2
3
标签的组成标签的组成
学生:尚姝宏
非关闭型标签:只有开始标签,没有结束标签
根据标签中的内容是否独占一行,分为:行级标签,块级标签
块级标签:块级标签包起来的内容,独占一行
行级标签:在行内显示,可以与其它内容在同一行显示
案例7:
2.3注释
注释在浏览器中是不会显示的,是用来标注解释html语句,但通过查看源代码的方式可以看到语法格式:
案例8:
2.4实体字符
也称为特殊字符,用于显示一些特殊符号,如:<> & 空格等
语法:
&实体字符的名称
常见的实体字符:
< < 小于号 less than
> > 大于号 greate than
空格space在html中对于连续的空白字符(包括空格,换行,TAB等),在浏览器中显示为一个空格
& & 与
" " 双引号
© © 版权符号 copyright
® ® 注册符号 register
× X 关闭符号
案例9:
2.5文档类型
在html文档第一行,使用声明HTML文档的类型用来告诉浏览器页面的文档类型,简单的来讲,用来指定的html版本的规范目前基本上最长用的html5,
三.常用表签
1.基本标签
标签
含义
说明
br
换行标签
非关闭型
p
段落标签
关闭型,块级标签,前后有明显的间隔
h1、h2…、h6
标签标签
按照h1到h6逐渐变小,块级标签、加粗显示
pre
预格式标签
保留编码时的格式
div
分区标签
常作为容器来使用,一般用来页面布局,块级标签
案例8:
案例9:
案例10:
weixin_46393370
发布了1 篇原创文章 · 获赞 0 · 访问量 45
私信
关注
来源:https://www.icode9.com/content-4-641401.html