前端——css
html 标签就基本不怎么做笔记了。css 的学习就稍微记录下，需要的可以自行百度搜索查找相关知识，例如：W3School
一、html的一些标签或相关知识
1、frameset
a、标签解释
1.frameset:是将多个界面组合成一个新的界面。
frameset 可以左右进行平分：cols ；也可以上下进行平分：rows
2.frame：src属性：来动态填充界面
3.注意点:
A.frameset，不能与body同时存在
B.frameset，可以进行嵌套的使用
b、例子
上下分两层，在下面那层又分左右两层
2、div
div 标签这里就不解释了，百度到处都有解释。
1、div一般需要与css进行搭配使用。
2、大部分网站都是使用div来进行模块化开发。
3、div是块状元素，不跟内容来进行填充，独占一行。
3、元素的转换
1、在html中标签分为三类 A.块元素 B.行元素 C.行块元素
2、块元素:不根据内容来进行填充独占一行，例子：div p
3、行元素:不独占一行，根据内容来进行填充：a span
4、行块元素:既有行元素的特征又有块元素的特征，不是独占一行，可以设置其宽度：img
二、css
1、css是什么以及能做什么
这里还是不解释。百度到处都有
2、css基本语法
1、css组成部分: A.选择器 B.声明
选择器：就是需要修饰的html标签。
声明:需要具体修饰的一些特征(样式)，声明可以存在一条，也可以存在多条。
2.例子：
p{color：red;font-size:12px}
3.注意点:
A、大括号中编写样式
B、多组属性是以英文分号进行分割
C、属性与属性值是不区分大小写，但是建议使用小写，选择器是区分大小写(除了标签以外)。
3、css样式引入方式
a、行内引入
1、行内引入:直接在标签中引入样式
2、优点：方便、简单
3、 缺点：html代码与css样式混合在一起，代码清晰结构度比较差
例子：
!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<h3 style="color: red;font-size: 20px;">库里超神得33分</h3>
</body>
</html>
b、内部引入
1.内部引入：在html标签的头部<head>中编写样式。
2.优点：html代码与css进行分离，代码清晰度比较高。
2.缺点：代码的扩展性比较差，其它的界面引入不到。
例子：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
div{
/*宽度*/
width: 200px;
/*高度*/
height: 200px;
/*背景颜色*/
background-color: red;
}
</style>
</head>
<body>
<div>
哈哈!今天天气真好
</div>
</body>
</html>
c、外部引入
1.外部导入：在css文件夹创建一个css文件编写样式，再页面进行引入。
2.优点：代码扩展性比较高。
3.缺点：可能会导致css样式冲突。
外部引入需要先创建一个 css 文件，文件里面写样式：
p{
color: red;
}
然后通过代码导入：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<!--引入css文件-->
<!--rel 告诉浏览器以css样式的方式进行解析 必须加上
href css文件的路径
-->
<link rel="stylesheet" href="css/demo.css"/>
</head>
<body>
<p>梅西获奖了</p>
</body>
</html>
还有另一种外部导入：
<style>
@import url("css/demo.css");
</style>
link 和 @import 的区别
link：引入任何的浏览器都支持，@import 不支持低版本ie浏览器。
link：先加载样式 再加载标签，@import 先加载标签 再加载样式(用户体验度差)。
4、三种引入方式的优先级
行内>内部 / 外部——就近原则
5、基本选择器
a、标签选择器
1、概念：以html标签来进行命名的选择器，就是标签选择器 例子：p div
2、语法：标签的名称 {属性名：属性值}
b、id选择器
1、概念：以id来进行命名的选择器 就是标签选择器 例子：#id名称{属性：属性值}
2、语法：# id选择器的名称 {属性：属性值}
3、注意点：id选择器需要在标签中进行引入，才会生效
c、类选择器
1、概念：以类来进行命名的选择器 就是标签选择器 例子：.class名称{属性：属性值}
2、语法：. 类选择器的名称 {属性：属性值}
3、注意点：类选择器需要在标签中进行引入 才会生效
d、三种基本选择器的优先级
1、优先级：id选择器> class选择器 > 标签选择器
2、提示:在编写页面时，不确定使用什么类型的基本选择器，建议使用类选择器。
id选择器一般是唯一；标签选择器容易冲突。
6、属性选择器
1、概念：以标签中的属性进行命名的选择器，就是选择器。
2、语法：标签[属性='属性值'] 标签[属性] 例子: input[type='text'] a[href]
7、层级选择器
1、概念：获取父子相关的标签，通过父级获取子级
2、语法：#id 类选择器 、类选择器 id选择器 、标签选择器 标签选择器
举个例子：
可以看到嵌套关系，外层就是父，内层就是子。
8、伪类选择器
1、a:link {} 未访问的链接 默认状态 (重点)
2、a:visited {}已访问的链接
3、a:hover {} 鼠标悬停链接 (重点)
4、a:active{} 已选择的链接
9、盒子模型
1、生活中盒子：内容：content + 内边距：padding + 边框：border + 外边距：margin，网页中的盒子模型就是这几部分。
2、两个盒子：纵向进行排列，同时设置margin值时，取的两个盒子较大的 margin 值。（两值只取最大值，并不是相加）
3、两个盒子：横向进行排列，同时设置margin值，取的两个盒子 margin 值之和。（横向时才是相加）
4、嵌套盒子:
两个盒子进行嵌套，给子盒子设置margin值：
产生问题：父容器塌陷的问题：父容器会随着子容器而移动。
解决方案：在父容器设置属性：overflow：hidden；
常用属性：
10、浮动
1.在网页中html中的元素,标签要么是从左到右进行排列,或者是从上到下进行排列,如果需要改变这个默认排列的
规则,就需要使用浮动。浮动的元素是脱离标准文档流(让元素飘起来)。例子：所有网站的导航栏均是float
（left、right）
2.注意点：
A.浮动的元素遇到其他容器的边界的时候会停止浮动。
B.浮动的元素会影响不浮动的元素，可以清除浮动来解决：clear（left、right、both）。
11、定位
799
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
