web 标准的构成
结构、表现、行为
- 结构 网页元素 整理分类 HTML
- 表现 美化界面 css
- 行为 交互页面 JavaScript
HTML笔记
html元素组成：行内元素，块级元素，空元素
html书写规范：
必须包括在尖括号里面
双标签：成对出现 单标签：特殊
标签关系：
包含关系 并列关系
<html>
<head>
<title> </title>
</head>
<body>
</body>
</html>
<html> 根部标签 <head> 头部标签 <title>文档标题 <body> 文档主题
骨架标签
1.文档声明 告诉浏览器使用哪种html来显示网页
位于文档最前端 处于之前
不属于HTML标签
2.lang 语言种类
zh-CN
3.charset 字符集
便于计算机能够识别和存储各种文字
常用标签
标题标签（作为标题使用，并依据重要性递减）
h1 h6 6级标题 加粗效果
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>标题一共六级选</h1>
<h2>文字加粗一行显</h2>
<h3>由大到小依次减</h3>
<h4>从重到轻随之变</h4>
<h5>安安安安安安</h5>
<h6>征征征征征征</h6>
</body>
</html>
(谷歌浏览器不能小于12px字号大小)
段落标签与换行标签
<p></p> 定义段落 分割段落 根据浏览器大小自动下一行
<br/> 换行标签
文本格式化标签
<strong></strong> 加粗 （常用）
<b></b> 加粗
<em></em> 倾斜 （常用）
<i></i>倾斜
<del></del> （常用） <s></s> 删除
<ins></ins> （常用） <u></u> 下划线
<hr />下划线
<div><div/>（一个独占一行）<span></span>(跨行显示，一行放多个) 装东西的盒子，用来布局
图像标签和路径
- 图像标签（【1】图像标签必须放在标签名的后面【2】属性间没有先后顺序，用空格分开 【3】属性采取键值对格式 属性=“属性值”)
<img src="图像URL" /> 单标签 src 指定图像文件的路径和文件名（必写）
alt 替换文本 图像显示不出来时用文字替换 <img src = "图片" alt="说明文字">
title（提示文本，鼠标放到图像上提示文字<img src=“图片”alt=“直接显示”title=“鼠标经过显示”/>
width 图像宽度
height 图像高度
<img src=“图片”alt=“直接显示”title=“鼠标经过显示” width="500" height="100"（高与宽修改一个就好） />
border 图片边框 粗细颜色
2.路径
目录文件夹和根目录
目录文件夹：存放相关素材 HTML文件、图片
根目录：打开文件夹后的第一层
相对路径：以图片相对于HTML页面位置（以文件所在位置建立的）
同级路径
例 <img src="img1.jpg"/>
上一级路径
例<img src="../img1.jpg"/>
下一级路径
例<img src="图片文件夹名/img1.jpg"/>
绝对路径 C：\ ...\ ... \img.jpg
超链接
<a></a>标签
<a herf="跳转目标" target= "目标窗口弹出"></a>
href 指定目标地址
target 用于打开页面方式(【_blank】新建窗口打开和【_self】当前窗口打开) rel 防止xssr攻击
链接分类
外部链接
<a href=""http://网址 target=“_self(当前窗口替换)/_blank(创建新窗口)”></a>
<a href="http://..." target="_blank"></a>
内部链接 网站内部之间的相互连接，直接连接内部页面名称 例：
<a href="index.html">首页</a>
空连接 当没有明确的连接目标时
<a href="#">首页</a> # 代替空页面
下载连接
<a href="下载文件名"></a>
网页元素连接
<a href="网址"><img src="img.jpg"></a>
为网页元素添加超链接
锚点连接
1. <a href="#名">***</a>
2. 找到目标位置标签，添加一个id属性 = 刚才的名字 例<h3 id="名">***</h3>
列表
无序列表
<ul>
<li>列表项</li>
<li>列表项</li>
</ul>
<ul>只能放<li></li> <li>里什么都可以放【任何元素和标签 】
自定义列表 （一个主题其他做解释）
<dl> （里面只能放dt，dd标签，而dd、dt标签里可以放任何标签）
<dt>关注我们</dt>
<dd>新浪微博</dd>
</dl>
有序列表 其各个列表项会按照一定顺序排列定义
<ol>
（只能嵌套）<li>列表项</li>
<li>列表项</li>
<li>列表项</li>
</ol>
