关于css的一些知识点整理

一、标签的类型:

行内:span、a、b、i、strong、em、   1.共处一行   2.不支持设置宽高

display:block; 转换成块

块:h1-h6 p div  ul ol 1.独占一行   2.支持设置宽高

display:inline; 转换为行内

行内块:img   1.共处一行   2.支持设置宽高

display:inline-block; 转换为行内块

二、定位

relative  相对定位,对象不可层叠

1、针对自己定位

2、不脱离文档流

*将窗体自上而下分成一行行, 并在每行中按从左至右的顺序排放元素,即为文档流

absolute  绝对定位。将对象从文档流中拖出,使用left,right,top,bottom等属性相对于其最接近的一个具有定位设置的父对象进行绝对定位。如果不存在这样的父对象,则依据body对象。

1、找具有定位的父级,找不到找body对象

2、脱离文档流

  3、元素变块

    4、宽度默认变小,小到内容的宽度

fixed  固定定位

  1、针对可视区定位

  2、脱离文档流

  3、可以把元素变成块

  4、宽度默认变小,小到内容的宽度

三、margin

margin的bug

1.margin塌陷(只对上下而言)               上下之间的margin - 重叠               不会相加

解决办法:          1.单方向定义          2.用padding(有条件)

2.margin  拖拽父级

    解决办法:           1.给父级加border           2.给父级加overflow-hidden (加堵墙)           3.用padding(推荐) 能用padding就用padding!!!

margin 是有好处的:

margin可以写负值;  Padding不可以;

  1.在没有定义宽高的快内 写Margin可以改变块的大小

  2.在定义宽高的块内  写Margin可以改吧块的位置

四、浮动

1、浮动的特点:

(1).脱离文档流          (2).可以把元素变成块                   (3).顶对齐          (4).它会跟着最高的后面

2、浮动的三要素:

  (1)加了浮动就得清浮动!

  (2)尽量设置宽度

  (3)同级元素浮动,同级所有元素都必须加浮动

3、清除浮动

   (1)给浮动元素的父级加  overflow:hidden;

   (2)给浮动元素最下边加  clear:both;

   (3)给浮动元素父级加 .clearfix:after{display:block; content:‘‘; clear:both;}

             .clearfix{zoom:1;}

五、元素变成块:
   diplay:block;
   float:left/right;
   position:absolte/fixed;

六、透明度设置

  filter:alpha(opacity:30);

  opacity:0.3;

时间: 2024-10-17 16:51:50

关于css的一些知识点整理的相关文章

css入门知识点整理

css入门知识点整理 不要嘲笑我这个蒟蒻..例子来源:w3school css其实就分为两个东西,一个是选择器,另外一个是声明.声明定义了某个对象的属性的值,这都是html的内容.重点要关注的是选择器.顾名思义,选择器就是用来"选择"HTML中的元素的.通过定义选择器可以选出HTML文档中的某些元素,然后把它们的样式变成声明中的.css的格式长这样: selector {declaration1; declaration2; ... declarationN } 这里有一个最基本的cs

asp.net mvc 3.0 知识点整理 ----- (2).Controller中几种Action返回类型对比

通过学习,我们可以发现,在Controller中提供了很多不同的Action返回类型.那么具体他们是有什么作用呢?它们的用法和区别是什么呢?通过资料书上的介绍和网上资料的查询,这里就来给大家列举和大致的概括下. (1). ActionResult(base):最基本的Action类型,返回其他类型都可以写ActionResult. (2). ContentResult:返回ContentResult用户定义的内容类型. public ActionResult Content() { return

asp.net mvc 3.0 知识点整理 ----- (3).asp.net mvc 3 和asp.net mvc 4 对比

asp.net mvc的版本更新很快,每个版本都在前一个版本的基础上,进行性能的优化和功能的完善和提升. 以下,便是我对比了下两个版本,发现最基本的差异.(更新补充中..) 一.关于配置类Global.asax的不同 为了较少配置类的杂乱代码,asp.net mvc 4 中 将Global.asax文件中的内容单独到 App_Start 下的几个配置文件中去. 在asp.net mvc 3 中: public static void RegisterGlobalFilters(GlobalFil

数据库设计教程系列——相关知识点整理

一.教程概述 此数据库设计教程是笔者参考网上资料.相关书籍,以及加上自己多年做数据库设计相关工作的经验积累写就. 数据库设计教程在网上已经有大量类似的资料,并且该领域有不少专业书籍,珠玉在前,心有戚戚. 但这作为唯心六艺之一,我还是希望能够在整理知识的同时,写出自己的一些内容,如果能够对读者 有所帮助,那就最好不过了,谢谢. 本教程主要基于关系型数据库进行讲解,对于维度数据库也会视情况有所涉猎. 下面是整个教程涉及的知识点整理,在撰写教程的过程中,如果有改动,也会调整更新此图. 二.知识点整理

【知识点整理】Oracle中NOLOGGING、APPEND、ARCHIVE和PARALLEL下,REDO、UNDO和执行速度的比较

[知识点整理]Oracle中NOLOGGING.APPEND.ARCHIVE和PARALLEL下,REDO.UNDO和执行速度的比较 1  BLOG文档结构图 2  前言部分 2.1  导读和注意事项 各位技术爱好者,看完本文后,你可以掌握如下的技能,也可以学到一些其它你所不知道的知识,~O(∩_∩)O~: ① 系统和会话级别的REDO和UNDO量的查询 ② NOLOGGING.APPEND.ARCHIVE和PARALLEL下,REDO.UNDO和执行速度的比较(重点)   Tips: ① 本文

CSS命名规则规范整理

转载声明:原载:彬Go本文链接:http://blog.bingo929.com/css-coding-semantic-naming.html 在此,非常感谢该文章作者的分享,本文完全转载自上面链接,此处作为备份,方便查看使用. CSS命名规则规范整理 大家在写css的时候,经常会遇到关于命名的问题.页面上成百甚至上千的class或者id,我们就会越来越感到困扰. 所以,这样我们就很有必要整理自己的一套命名规范.这里我就说说我自己的命 大家在写css的时候,经常会遇到关于命名的问题.页面上成百

【Android 面试基础知识点整理】

针对Android面试中常见的一些知识点整理,Max 只是个搬运工,感谢本文中引用文章的各位作者,给大家分享了这么多优秀文章,对于其中的解析,是原作者个人见解,有错误和不准确的地方,也请大家积极指正. 本文将持续更新,同时我也将其放在Github上:Point-of-Android 同时可以看Max的个人博客:海上钢琴师 Android中的异步任务机制 Android中AsyncTak的使用与源码分析 http://blog.csdn.net/bboyfeiyu/article/details/

·DP」知识点整理

一.最长公共子序列(LCS Longest Common  Subsequence) 第一,先说区别,最长公共子串和最长公共子序列是不一样的. 最长公共子串不许是连续的,而最长公共子序列可以是不联系的. 网络上解释的子序列: 一个字符串S,去掉零个或者多个元素所剩下的子串称为S的子序列.最长公共子序列就是寻找两个给定序列的子序列,该子序列在两个序列中以相同的顺序出现,但是不必要是连续的. 例如 X=ABCBDAB Y=BDCABA BCA是X和Y的一个公共子序列,但是不是X和Y的最长公共子序列,

Python--matplotlib绘图可视化知识点整理

Python--matplotlib绘图可视化知识点整理 强烈推荐ipython 原文:http://michaelxiang.me/2016/05/14/python-matplotlib-basic/ 无论你工作在什么项目上,IPython都是值得推荐的.利用ipython --pylab,可以进入PyLab模式,已经导入了matplotlib库与相关软件包(例如Numpy和Scipy),额可以直接使用相关库的功能. 本文作为学习过程中对matplotlib一些常用知识点的整理,方便查找.