CSS知识

一、CSS路径

1.链接标签：核心属性就是href   属性值可以是一个跳转的地址，适用于任何带有路径的东西，href里面的内容就是路径

2.绝对路径：从盘符开始，然后依次的往下查找

                     本地：C:/Users/Administrator/Desktop/0527day01/07.html

                     服务器的：www.baidu....       127.0.0.1

3.相对路径: 从当前文件开始，如果下一级目录就直接写文件夹名，上一级用../表示

4.盘符根路径： 直接可以跳转到当前文件所有的盘符根目录中 

二、图像标签

  src   图片的路径

  alt   当图片显示不出来的时候才会显示，图片正在下载的时候， 图片的路径错误的时候

  img是我们接触的第一个行内块标签，靠左或者靠右

1.前端和后端之间的通信：1.form提交方式

                                           2.ajax提交方式

2.核心标签：只有提交的功能，没有任何的样式

3.属性：action 提交的地址，通常为服务端的地址，如果不写，默认往本页提交

           method 提交的方式。get/post 如果不写，为get提交

4.input、button是一个行内块标签，input是表单的核心标签，通过修改input标签中的type属性来改变展现的样式

5.?后面的内容表示参数。我们最终的目的是要把必须的参数给发送到后端，想要发送参数，input中必须含有name属性

6.一组必须含有相同的name属性值

   input中的值有一个属性，value属性

   checked 默认选中，当属性名等于属性值的时候，只需要写属性名即可

三、学习CSS

1.     html               结构，承载内容

        css                 样式

        JavaScript      行为

css的使用方式：

1.行内样式（内联样式）
<标签 style="属性名1:属性值1;属性名2:属性值2;..."></标签>

2.页面嵌入（内部样式表）
在head标签里面增加一个子标签
<style>
选择器{
属性名1:属性值1;
属性名2:属性值2;
......

3.外部文件（外部样式表）
在head标签里面增加一个子标签
<link rel="stylesheet" href="css文件的路径" />

4.外部导入样式
主要用在样式初始化。因为有一些标签有自己的样式，我们需要清空，方便自己计算

5.css语法： （符号都是英文的）
   选择器{
   属性名1:属性值1;
   属性名2:属性值2;
   ......
}

四、CSS选择器

1.ID选择器
使用id选择器：在元素上面增加一个id属性,id属性的属性值不用用数字开头
一个页面中只能有一个id属性值
css中id选择的表示方法用 # 表示
2.class选择器
使用class选择器：在元素上增加一个class属性，class属性的属性值不能用数字开头
一个页面中可以有多个class属性值
css中class选择器的表示方法用 . 表示
3.标签选择器
直接写标签名
4.组合选择器
选择器直接用,分隔开即可
5.子代选择器
> 只针对子代
6.后代选择器
用空格表示，包含着子代选择器
7.通用选择器
* 针对于所有的标签

五、选择器权重

内联样式            1000
id                        100
class                   10
元素                    1
通用                    0
boss !important          只要出现，就以这个为主

（权重越高，冲突部分的样式就以权重高的为主，并不是说这个选择器没有用了，而是里面冲突的样式，权重仅仅只能作为参考）

1.权重的计算：
   不需要管子代和后代的
    如果权重相同，就近原则。以后定义的为准

text-align: right; /*文本对其方式*/
text-decoration: underline; /*文本下划线*/
color: #f00; /*设置字体的颜色*/
line-height: 166.67px; /*文本的行高*/
/*一行文字所占的高度,让他上下居中*/

/*font-family: "Microsoft YaHei";*/ /*设置字体的样式:宋体，楷体... 去百度，翻译中英文 */
font-family: "宋体"; /*自己去百度找到宋体对应的英文，节约空间*/
font-style: italic; /*规定字体是否倾斜*/
font-weight: bold;
font-size: 16px ; /*设置字体的大小*/
2.在浏览器中,默认的字体大小16px，谷歌浏览器中，字体大小最小可以为12px，火狐没有限制

3.:hover 叫伪类选择器，当你的鼠标放上去的时候，会变化成的样子，权值 10

4. cursor: none; /*设置鼠标的样式*/
    display: block; /*元素分为三大类,设置元素的显示方式
    行内 inline
    块级 block
    行内块 inline-block
     none 无

5. opacity: 0.1;      /*取值的范围是0-1之间，可以为0和1*/          表示整个元素

   background-color: rgba(255,0,0,0.1);        /*最后一个参数a表示透明度，取值的范围是0-1之间，可以为0和1*/      只表示背景颜色