Skr-Eric的HTML课堂(一)——HTML的介绍、基础语法、文档组成

1. Web

1. 什么是WEB

Web就是网页,网页其实是基于B/S模式的应用程序

B/S : Browser / Server

C/S : Client / Server

2. Web 的组成

浏览器 :代替用户向服务器发送请求

服务器 :接收用户请求并响应

通信协议 :规范数据传输及打包方式

3. 服务器

1. 作用 :

接收用户请求并响应

存储数据

具有安全性功能

2. 产品 :

1. Tomcat

2. Apache

3. Nginx

4. IIS - Internet Information Service

...

3. 技术 :

1. Python-Web (Django , Flask...)

2. PHP

3. JAVA

4. ASP.net

5. JSP... JAVA Serverlet Page

4. 浏览器 :

1. 作用 :

代替用户向服务器发送请求

作为响应数据的解释引擎,呈现图形化界面

2. 主流的浏览器产品 :

1. Chrome  - Google公司

2. IE    - Microsoft

3. Safari  - Apple

4. Firefox - Mozilla

5. Opera   - Opera

3. 浏览器引擎(内核)

1. 渲染引擎 - 解析HTML、CSS,控制页面渲染效果

2. JS引擎 - 解析JS脚本

4. 前端技术

1. HTML 书写页面结构和内容

2. CSS  设置网页中元素的样式

3. JS 实现网页的交互

-----------

4. 工具库,框架

 

2. HTML 概述

1. HTML介绍

1. HyperText Markup Language

超文本   标记  语言

作用 :书写页面结构

2. 超文本 :

具有特殊功能的文本

et :

普通文本 a

超文本 a 表示超链接

普通文本 b

超文本 b 表示加粗

3. 标记

也叫标签、元素

主要用来标记网页中的内容

可以实现网页布局及JS交互

2. HTML在计算机中的表现形式

网页文件在计算机中都是以.html / .htm 后缀表示

开发工具 :

1. 记事本

2. EditPlus Sublime WebStorm VSCode

运行工具 :浏览器 以Chrome浏览器为准

调试工具 :浏览器开发者工具 F12

 

3. HTML基础语法

1. 标签 / 标记

1. HTML中的标签都以<>为标志

2. 标签分类 :

1. 双标签 :成对出现,有开始标签,有结束标签

et :

<html> </html>

2. 单标签 : 只有开始标签,没有结束标签,

可以手动添加/表示闭合

et :

<hr> 水平线

<hr/>

3. 标签嵌套

1. 在成对的标签中出现其他的标签

<html>

标签内容

</html>

--------------

<html>

<head>

网页的头部信息

</head>

<body>

网页的主体信息

</body>

</html>

2. 在嵌套结构中,外层标签称为 “父元素”,内层

元素称为“子元素”,多层嵌套时,

内部元素称为后代元素

4. 文档结构

<html>  文档开始

<head>

网页头部信息 :编码方式,网页名称

网页选项卡的小图标,网页信息介绍

引入外部资源文件

</head>

<body>

网页的主体信息 :所有需要呈现给用户的

,需要显示在窗口中的内容,都应在body

中书写

</body>

</html> 文档结束

5. 标签属性

标签属性主要是用来修饰当前标签的显示效果,

对当前标签或者网页的补充设置

语法 :

1. 书写位置 :

标签属性都书写在开始标签中,与标签名之间

使用空格隔开

2. 属性是由属性名和属性值组成的

属性名="属性值"

属性值必须使用引号引起来,单双引号都可以

3. 多个属性时,属性之间使用空格隔开

6. HTML 语法规范

1. HTML 不区分大小写,html HTML htML

推荐使用小写字母

2. 保持适当缩进,保证代码可读性

3. 保持适当注释,保证代码可读性

7. HTML注释

<!--

注释内容

-->

注意 :

1. HTML 注释不能嵌套

2. 不能书写在标签内部的

<body <!-- -->> 错误

</body>

8. HTML中的换行与空格

HTML 会忽略多余的空格,只显示为一个空格

代码中的换行,在浏览器中也表现为一个空格

 

4. HTML文档组成

1. 文档类型声明

<!DOCTYPE html> 声明当前为HTML文档

这种是 H5 的声明方式

作用 :

1. 告诉浏览器文档为HTML文档

2. 按照H5的渲染方式解析网页

书写位置 :

文档开头,<html>标签之前

2. 文档内容

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>网页标题</title>

</head>

<body>

网页主体

</body>

</html>

说明 :

<meta charset="utf-8">

设置网页的字符编码方式

------------------------

<title>百度一下,你就知道</title>

设置网页标题

 

 

 

想要看更多的课程请微信关注SkrEric的编程课堂

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值