一、复习

  1. 什么是CSS? 
    层叠样式表 -层叠样式只会被覆盖而不会被替代
  2. CSS的使用方式 
    style属性---> <h1 style="css属性"></h1> 
    sytle标签---> head标签里面 
    link---><link rel="stylesheet" href="style.css">
  3. 基础选择器
    html标签选择器 通过html标签名来选择元素 
          ①所有的html标签都可以当做选择器 
          ②无论标签藏多深都会被选中 
          ③选择的是所有的标签而不是具体某个标签。所以说我们通过html标签选择器来设置的都是一些共性问题 
    id选择器 
          ①任何的标签都可以用id属性和属性值(因为id是一个全局属性)。id命名不能随意的命名。大小写敏感,id的名字中可以有数字字母下划线,但是要以字母开头。 
                驼峰命名法   小驼峰命名法  大驼峰命名 
                testHeader小驼峰TestHeader大驼峰       ②但是id名不能够重复 
    class选择器 
          ①任何的标签都可以使用class属性(class属性也是一个全局属性) 
          ②class属性名可以重复使用 
          ③一个class属性中,可以有多个class属性值。

二、综合选择器

  1. 后代选择器 div p
  2. 交集选择器 div.dl
  3. 并集选择器 div,p
  4. 子元素选择器 div>p
  5. 序列选择器 ul li:first-child   ul:li:last-child
  6. 相邻兄弟选择器 div + p
  7. 普通兄弟选择器 div ~ p

三、继承

  1. 继承:父元素的某些css属性会被子元素无条件的继承过去。关于文字的css属性都可以进行继承:color text-  line-font-
  2. 层叠 
    层叠解决的是css冲突的问题 
    比较权重来解决层叠问题 
    !important能够把"单独属性"的权重变为无限大。尽量少用。

四、块级元素和行内元素

div 块级元素 
span 行内元素 
块级元素和行内元素的区别: 1. 行内元素部不能够设置宽度和高度。行内元素的宽度和高度是标签内同的宽度和高度。块级元素可以设置宽度和高度 2. 块级元素会单独占一行。而行内元素却不能够独占一行,只能和其他行内元素共用一行。 3. 如果块级元素不设置宽度,那么块级元素会自动的占满父元素的全部宽度。

小白学习css记录的更多相关文章

  1. 学习CSS记录:CSS文件引入到HTML中

    1.直接写在标签元素中,通常称为行间样式.(优先级较高,有悖于结构与表现的分离,建议不使用) 例:<body style="background:red;"></ ...

  2. 学习CSS记录:选择符优先级

    1.标有!important 关键字声明属性. 2.HTML中的CSS样式属性. 3.作者编辑的CSS文件模式属性. 4.用户设置的样式. 5.浏览器默认的样式. ------------------ ...

  3. 小白学习python之路(一):安装python3

    引言 作为一个python小白,之前学的是java,不过听说python很流行,功能很强大,可以用很少的代码实现更强的功能,因此我也是被吸引了过来,并且把我的学习经历记录下来.     当然了,要学习 ...

  4. 学习 CSS 样式

    1.CSS浮动  :  http://www.cnblogs.com/zhongxinWang/archive/2013/03/27/2984764.html (1)一个重要结论:           ...

  5. css知多少(2)——学习css的思路

    两周之前写过该系列的第一篇,其实当时只是一个想法,这段时间迟迟未更新,是在思考一个解决过程.现在初有成效,就开更吧. 1. 一个段子 开题不必太严肃,写博客也不像写书,像聊天似的写东西是最好的表达方式 ...

  6. Activiti 学习笔记记录(2016-8-31)

    上一篇:Activiti 学习笔记记录(二) 导读:上一篇学习了bpmn 画图的常用图形标记.那如何用它们组成一个可用文件呢? 我们知道 bpmn 其实是一个xml 文件

  7. Activiti 学习笔记记录(二)

    上一篇:Activiti 学习笔记记录 导读:对于工作流引擎的使用,我们都知道,需要一个业务事件,比如请假,它会去走一个流程(提交申请->领导审批---(批,不批)---->结束),Act ...

  8. PostgresSQL 学习资料记录处

    PostgresSQL 学习资料记录处  博客:http://francs3.blog.163.com PostgreSQL9.4 中文手册:http://www.postgres.cn/docs/9 ...

  9. 开始学习css

    今天开始学习css:应用一本<HTML5与CSS3网页设计基础> 先学习css样式规则声明. Body{ color:blue} 对应:选择符:{声明属性:声明值}: Background ...

随机推荐

  1. JAVA JVM 杂谈(一)

    JVM能够跨计算机体系结构来执行Java字节码,主要是由于JVM屏蔽了与各个计算机平台先关的软件或者硬件之间的差异,使得与平台先关的耦合统一由JVM的提供者来实现. JVM结构组成: 1.类加载器:在 ...

  2. css 清楚浮动三种方法

    我们可以看到这样一个布局: <style> .left{ width: 200px; height: 200px; background-color: #00ee00; float: le ...

  3. java面向对象概念2

    一.理解“万事万物皆对象”. 1.在java语言范畴中,我们都将功能.结构等封装到类中,通过类的实例化,来调用具体的功能结构. 2.涉及到java语言与前端html.后端的数据库交互时,前后端的结构在 ...

  4. MYSQL ERROR 1049 (42000): Unknown database

    https://www.cnblogs.com/hedgehog105/p/10196566.html lower_case_table_names=2

  5. 微信小程序通过background-image设置背景图片

    微信小程序通过background-image设置背景:只支持线上图片和base64图片,不支持本地图片:base64图片设置步骤如下:1.在网站http://imgbase64.duoshitong ...

  6. mybatis的CRUD实例(三)

    前面的文章我们已经实现了根据id查询用户信息的功能,下面我们进行其他业务功能的实现. 一.根据用户名模糊查询用户列表 查询使用的sql : select * from user where usern ...

  7. 求两个数a、b的最大公约数

    //求两个数a.b的最大公约数 function gcd(a,b){ return b===0?a:gcd(b,a%b) }

  8. oracle闪回(flashback)的部分实用操作(彻底删除的除外)

    一.数据delete并且commit提交之后的闪回 (一):根据时间来恢复:1.查询数据库当前时间(目的是为了检查数据库时间是否与你电脑时间相近,避免时间不同而将数据恢复到错误时间点)select  ...

  9. ajax session timeout

    授权过期后AJAX操作跳转到登录页的一种全局处理方式 菜鸟程序员之Asp.net MVC Session过期异常的处理 基于WebImage的图片上传工具类

  10. fastclick源码分析

    https://www.cnblogs.com/diver-blogs/p/5657323.html  地址 fastclick.js源码解读分析 阅读优秀的js插件和库源码,可以加深我们对web开发 ...