HTML
1.基础
1.HTML 超文本标记语言
2.学习目标 :
各种各样的标签
标签的作用
标签的特点
标签上的属性
属性的值
3.分类:
双标签 | 闭合标签 :
单标签 | 自闭和标签 :
4.属性: 帮助更完整的展示标签的作用|功能(扩展标签的功能)
属性的签名必须添加空格
属性名 = ‘属性值’ | “”
5. 版本声明
这是h5的版本声明方式
6. <meta charset="UTF-8"/> 解码格式
告诉浏览器使用什么样的编码格式解析html页面中的内容
保证编码解码格式统一
功能会自动根据<meta charset="UTF-8"/>设置,保证文件 的编码和解码的统一
- 常用标签
head : 定义的内容是给浏览器的一些设置
title : 标题标签
在head中必须包含title标签
唯一 一个能够被用户看到的标签
有利于搜索引擎的优化
当页面被收藏,title标签对中的内容作为书签名
body : 给用户看的内容
bgcolor : 背景颜色
颜色值的设定:
颜色的英文单词
颜色的十六进制 #+6个字符
三原色 rgb(0255,0255,0~255)
background : 背景图片
绝对地址 http://…
相对地址 images/xxx.png
2.常用标签
1.a标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<title>常用标签</title>
</head>
<body>
<!--
a 超链接标签
属性:
href 定义连接地址 必填属性
绝对地址
相对地址 : 相对当前文件位置而言
title 属性:
为a标签定义标题,当鼠标悬停在元素上时候显示的提示字
target 打开方式
_blank 新页面打开
_self 本页面打开 默认
样式:
下划线
连接未点击 : 字体蓝色
连接已点击 : 字体紫色
a 锚点|锚链接
1) 设置定点
2) 点击a标签跳转到对应的定点
a标签的href属性的值与定点的id属性值保持一致 href = "#buttom"
-->
哈哈
<a href="http://www.mi.com" title="小米小米" target="_blank">小米官网</a>
<a href="htm01l入门.html">html01入门.html</a>
<a href="#buttom">去底部</a>
<div id="buttom">最底部</div>
</body>
</html>
2.h标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<title>常用标签</title>
</head>
<body>
<!--
p 段落标签
语义化
正常显示
块元素
嵌套关系: 只能嵌套p标签,行内元素,文本
标签的分类:
块元素 : 独占一行,前后换行
设置快高
嵌套块元素,行内元素,普通文本
可以设置上下左右的内外边距
行内元素 : 宽度有内容决定,能和其他行内元素|文本同行显示
不能设置宽高
只能嵌套行内元素和文本
不能设置上下的内外边距
h*标题标签
h1~h6
根据权重的不同字体大小依次减小
加粗,字体大小有变化
语义化
与搜索引擎优化有关
-->
这是p之前
<p>我是一个可爱的p标签</p>
这是p之后
<h1>我是h1</h1>
<h2>我是h2</h2>
<h3>我是h3</h3>
<h4>我是