认识HTML和CSS

1.对HTML的认识

HTML是一种超文本标记语言（Hyper Text Markup Language）
HTML不是一种编程语言，而是一种标记语言，描述网页的语言
HTML使用标签描述网页中的图片、文本、音乐、视频、超链接等

H5在2014-10-28出现的

---

2.基本标签

标题标签<h1></h1> 至<h6>
段落标签<p></p>
换行标签<br/>
水平线标签<hr/>
斜体<em></em>
字体加粗<strong></strong>
图像标签<img src="图像路径" alt="替换文本" width="x" height="y"/>
超链接<a href="链接地址" target=" 目标窗口位置（是新建窗口还是本窗口）">文本或者图像</a>
其中target内的属性值
_blank 在新窗口中打开被连接文档(新开的窗口中打开)
_self 默认。在相同的框架中打开被链接文档（其实就是在它所在的窗口打开，不能扩大范围）
_parent 在父框架集中打开被链接文档（就是在你的上一个（父类）网页中打开）
_top 在整个窗口中打开被链接文档（打开后会占用整个窗口）
framenname 在指定的框架中打开被链接文档

注释和特殊符号

<!--   -->

空格   #160 　v1d
大于号 >
小于号 <
引号 " w3c规定都是成对出现

版权符号© ©

3.w3c 扩展World Wide Web Consortium 万维网联盟

规范
标签名称、属性名称必须小写
标签必须严格嵌套，并且必须闭合，即使空元素标签也必须闭合
属性值必须用引号引起来
网页上播放视频和音频的方法

视频元素video

<video src="视频路径" controls提供播放、暂停和音量的控件></video>
<video src="video/video.mp4" controls></video>

能不能播放看浏览器的支持格式。关键字source若带有两个源文件的音频播放器。
浏览器需要选择它所支持的源文件（如果都支持则任选一个）：

<video controls="controls" loop="loop"><!-- 暂停播放按钮 和  实现视频的虚幻播放-->
	<source src="video/video.webm" type="video/webm"/>
	<source src="video/video.mp4" type="video/mp4"/>
</video>
<video autoplay><!-- 自动播放按钮-->
	<source src="video/video.webm" type="video/webm"/>
	<source src="video/video.mp4" type="video/mp4"/>
</video>

音频元素audio

<audio       controls="controls">
	<source src="music/music.mp3" type="audio/mpeg"/>
	<source src="music/music.ogg" type="ogg/wav"/>
</audio>

---

H5结构元素
header 标题头部区域的内容
footer 标记脚部区域的内容
article 独立的文章内容(网上：section不能独立出现，它的出现必定是在article下！)
section Web 页面中的一块独立区域，它规定得有一个标题

aside 相关内容或应用（常用于侧边栏）
nav 导航类辅助内容

---

css样式
优势
1.内容与表现分离
2.网页的表现统一，容易修改
3.丰富的样式，使页面布局更加灵活
4.减少网页的代码量，增加网页的浏览速度，节省网络带宽
5.运用独立于页面的CSS，【有利于网页被搜索引擎收录】

---

4.选择器

标签选择器
h1{
font-size:12px;
color:#F00;
}
类选择器
.second{
font-size:20px;
color:#096;
}
ID选择器
#third{
font-size:24px;
color:black;
}

任何标签的id规定不可重复（标签本身的规则规定）
样式的优先级：ID选择器》类选择器》标签选择器

---

网页中引用css样式
在header表头标签内部调用

<header>
       <link href="style.css" rel="stylesheet" type="text/css"/>
       <关键字link href="css样式路径" 
</header>

内联样式
内部样式表
外部样式表：链接式 导入式

---

链接式与导入式的区别
1.标签属于XHTML，@import是属于CSS2.1
2.使用链接的CSS文件先加载到网页当中，再进行编译显示
3.使用@import导入CSS文件，客户端显示HTML结构，再把CSS文件加载到网页当中
4.@import是属于CSS2.1特有的，对于不兼容CSS2.1的浏览器来说就是无效的

行内样式》内部样式表》外部样式表

mysql --空格
xml // /* */ /** */
css /**/
html

前后台数据交互
a标签 不安全
表单
Ajar

前台是录入信息 是安全性
后台是校验信息 是准确性

字体 font ： 格式（斜） 宽 字号 字体