HTML

最新推荐文章于 2022-06-07 09:04:39 发布

weixin_44765758

最新推荐文章于 2022-06-07 09:04:39 发布

阅读量151

点赞数

本文链接：https://blog.csdn.net/weixin_44765758/article/details/88634122

版权

学习目标

1、介绍 html

     html是什么

Html （Hyper Text MarkUp Language）超文本标记语言
超文本：比普通文本有更强大的功能 ----音频、视频、图片、链接等等
标记：<关键字></关键字>，不属于编程语言，只是一门标记语言

什么是HTML文档、 HTML标签、HTML元素、 HTML属性
HTML文档：网页
HTML标签：一般情况为双标记 <关键字></关键字>-------eg:

第一个为开始标签

，第二个为结束标签

也包含有单标记（空标记），没有结束标签：eg:

HTML元素：开始标记和结束标记之间的文本内容和html标签统称为html元素
Eg: 手机端
HTML属性：属性名 = “属性值”，写在开始标记中，注意，属性与标签名（属性）之间必须有空格
eg:<div id:“box” class=“hehehe” >
如何创建一个 html
创建一个文件，后缀名为.html和.htm
Html 文件由head标签（html元数据信息）和body标签（网页中展示给用户的内容）组成

HTML的结构：

-------版本类型声明：告诉浏览器当前网页的版本信息，浏览需要以相应笨笨执行该网页

<html>-------根标记   
   <head>
   <title>课程内容</title>--------html文档的标题  //常用标签
   <meta charset="utf-8">--------编码集 utf-8/gbk
  </head>-------html文档头部
   <body></body>-------html文档主体内容部分

注意：标签名是不区分大小写的，建议使用小写的标签名

  编辑器实现前端代码的便捷书写：WebStorm    Hbuilder      DreamWaver等等




     html的语法规范
     html的组成

2、常用的标签

h1~h6 ：标题标签，数值越大标题越小（加粗）---------- 块级标签
style 属性用于设置样式
background：red 背景颜色设置
width ：500px 宽 1px代表一个像素的大小
height：250px 高
p ：段落标签 ------------------块级标签
style属性用于设置样式
text-indent：2em 缩进 1em 代表一个字符的位置大小
span ：一个没有特殊含义的标签，选中某些文本内容针对性的进行设置 -----------行内标签
style属性用于设置样式
color ：green
strong/b ：加粗 strong含有加强的语气 --------行内标签
em/i ：倾斜 em含有加强的语气 --------行内标签
br ：换行单标记 ------------块级标签
hr ：分割线单标记 ---------块级标签
div ：用于布局，经常使用的标签 ----------块级标签
标签分成三类：
1、块级标签：默认独占一行，可以给它设置宽高
2、行内标签：不能设置宽高，不是默认独占一行，大小是由文档内容的多少来决定的
3、行内块级标签：可以设置宽高，没有默认独占一行

标签之间的嵌套：
1、行内可以嵌套行内标签，行内不可以嵌套块级标签
2、块级标签既可以嵌套行内标签，又可以嵌套块级标签

列表：
1、有序列表
ol 有序列表的标签
li 有序列表项的标签
使用type 属性，可以设置有序列表的排序字符1，a ,A
2、无序列表
ul 无序列表的标签
li 也是无序列表的列表项
使用type 属性，
3、定义列表
主要作用：名词解释
dl 定义列表的标签
dt ：被解释的名词
dd ：解释语句

3、案例
蜀道难

Title

蜀道难

李白

噫吁嚱，危乎高哉！蜀道之难，难于上青天！蚕丛及鱼凫 ，开国何茫然！尔来四万八千岁，不与秦塞通人烟。西当太白有鸟道，可以横绝峨眉巅。地崩山摧壮士死，然后天梯石栈相钩连。上有六龙回日之高标，下有冲波逆折之回川。黄鹤之飞尚不得过，猿猱欲度愁攀援。青泥何盘盘，百步九折萦岩峦。仰胁息，以手抚膺坐长叹。

问君西游何时还？畏途巉岩不可攀。但见悲鸟号古木，雄飞雌从绕林间。又闻子规啼夜月，愁空山。蜀道之难，难于上青天，使人听此凋朱颜！连峰去天不盈尺，枯松倒挂倚绝壁。飞湍瀑流争喧豗，砯崖转石万壑雷。其险也如此，嗟尔远道之人胡为乎来哉！

剑阁峥嵘而崔嵬，一夫当关，万夫莫开。所守或匪亲，化为狼与豺。朝避猛虎，夕避长蛇；磨牙吮血，杀人如麻。锦城虽云乐，不如早还家。蜀道之难，难于上青天，侧身西望长咨嗟！