html是什么型语言,HTML笔记

一、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:

183869782_1_20200226023817894

案例2:

183869782_2_20200226023818331

案例3:

183869782_3_20200226023818769

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:

183869782_4_20200226023818988

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:

183869782_5_20200226023819722

案例9:

183869782_6_20200226023820550

案例10:

183869782_7_20200226023820909

183869782_8_20200226023821566

183869782_9_202002260238223.png

weixin_46393370

发布了1 篇原创文章 · 获赞 0 · 访问量 45

私信

关注

来源:https://www.icode9.com/content-4-641401.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值