html讲解

本文介绍了HTML的基本概念,包括其作为超文本标记语言的作用,文档结构(doctype、html、head、body)、标签属性的使用方法。通过实例演示如何使用HTML创建简单的页面并设置字体颜色。此外,还列举了常用的标签如标题、段落、粗体、斜体等及其用法。
摘要由CSDN通过智能技术生成

1. ⽬标

知道什么是HTML

2. 路径

1. 什么是html

2. html可以做什么

3. 讲解

3.1什么是html

超⽂本标记语⾔(Hyper Text Markup Language),标准通⽤

标记语⾔下的⼀个应⽤。HTML 不是⼀种编程语⾔,⽽是⼀种

标记语⾔,是⽹⻚制作所必备的。

超⽂本标记语⾔:功能⽐⽂本强⼤, 就是指⻚⾯内可以包含图

⽚、链接,甚⾄⾳乐、程序等⾮⽂字元素。

超⽂本标记语⾔: 语法由标签组成

学习HTML的核⼼是标签

3.2.html可以做什么

设计⻚⾯,做⽹⻚

4. ⼩结

1. 什么是HTML?

超⽂本标记语法

2. 标记语⾔

设计⻚⾯,做⽹⻚

知识点-HTML结构和基本语法

1.⽬标

掌握HTML的结构和基本语法

2.路径

1. HTML的结构

2. HTML语法规范

3. 标签属性

3.讲解

3.1HTML的结构

887e8e0c31cf4ac091d141673b98e82a.jpg

 ⽂档结构介绍:

⽂档声明:⽤于声明当前HTML的版本,这⾥的 <!DOCTYPE html>是HTML5的声明

html根标签:除⽂档声明以外,其它内容全部要放在根 标签html内部

⽂档头部配置:head标签,是当前⻚⾯的配置信息,

外部引⼊⽂件, 例如⽹⻚标签、字符集等

⽂档显示内容:body标签,⾥边的内容会显示到浏览 器⻚⾯上

3.3.标签属性

d1e147d9d6e6432ea0fb533e75f777ee.jpg

 武器 (标签) 属性(标签属性)

攻击之⽖ +6点攻击⼒

倚天剑 +50点攻击⼒ 15%暴击

属性是属于标签的,修饰标签,让标签有更多的效果

属性⼀般定义在起始标签⾥⾯。

<font color=red>hello</font>

属性⼀般以 属性=属性值的形式存在

属性值⼀般⽤ '' 或者“ ” 括起来。 不加引号也是可以的. (不建议使⽤)

4.⼩结

1. HTML结构

2b6568e0fc3e43cc97a41135608c7d6f.jpg

2. 语法和属性基本和xml类似, 但是不要背, 练练就⾏了

实操-HTML快速⼊⻔

1. 需求

使⽤HTML展示hello sz85... 字体颜⾊为红⾊

2. 步骤

1. 创建⼯程

2. 创建HTML

3. 定义 font标签

4. 设置font标签的color属性为red

3. 实现

3.1 使⽤idea创建static web项⽬

1. File -> new -> Module

2297b7d75c14455583708f25585c2ca4.jpg

 2. 选择static web

536f2773b9564671bed0e4c7f8532d25.jpg

 3. 设置Module的名称

1adc30e3dca148248e36a34414ba788b.jpg

 3.2 创建html⽂件
1. 在static web项⽬上右键 -> New -> Html File

5b1352a59469464191db3f5c81b0f18d.jpg

 2. 设置HTML⽂件名称

a71f895a70344d9cbf0126b327bd729c.jpg

 3.3 编写HTML代码

21f7d7e9e52f45f980765eea4242ab25.jpg

 

3.4 使⽤浏览器访问

1. 把⿏标移动到右上⻆,会浮动出来浏览器按钮,点击

“Chrome”按钮,使⽤Chrome浏览器打开当前⽹⻚

087a06c8fcb1411d9a847db69873f6d0.jpg

 2. 在浏览器上看到效果

fb735a9ab43a430f80f43be7d342f7ed.jpg

 4. ⼩结
第⼆章-HTML常⽤的标签
练习-公司简介
1. ⽬标
按照需求完成某个公司的公司简介
2. 路径
1. 学习⽂字排版相关的标签
1. 标题标签
2. 横线标签
3. 段落和换⾏
4. ⽂字标签
2. 使⽤⽂字排版标签,完成公司简介

3. 实现

3.1.排版标签

字体标签

标题标签

段落标签

注意:段落之间⾃动进⾏换⾏

粗体标签

斜体标签

下划线标签

<font color="字体颜⾊" size="字体⼤⼩(1~7)"

face="字体⻛格">哈哈</font>

<hn>标题<hn> n取值1~6, 1是⼀级标题, 2是⼆级标题...

<p>段落</p>

<b>内容</b>

<i>内容</i>

<hr/>

3.2 公司简介练习

思路

1. 创建HTML

2. 创建标题标签

3. 创建下划线标签

4. 创建4个段落标签

5. 在第⼀个段落的前⾯⽂字, 嵌套font标签 ,设置color=red

实现

b4ccfdd35edc4b94925bedc19631056f.jpg

66e717f46a824bcab8e8446004ee7e50.jpg 

 4. ⼩结

1. 标题标签

<hn></hn>   n取值1~6

2. 段落标签 段落之间⾃动进⾏换⾏

<p></p>

3. 粗体标签

<b></b>

4. 斜体标签

<i></i>

5. 换⾏标签

<br/>

6. 下划线标签

<hr/>

 

 

 

 

 

 

 

 

 

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值