关于定位中left和right,top和bottom的权重问题

  在共同类中设置了定位并且设置了left等定位,如果你引用这个类并加入其他的类中也有left和right等定位,那么你设置的right或是bottom将会无效。

  原因:因为在定位中,left比right的权重高,top比bottom权重高,所以才无效果

  解决办法:在共同的类中把left设置为:left:auto或者是把left属性删除,各自的类设置并无互相影响;

  案例分析:

  在轮播图中,给两个盒子向前向后按钮同时添加一个共同的定位left值,然后再把两个盒子用right分开时,没有效果,还是重叠在一起。

  html代码

  有问题的css代码

  公共类属性设置

  各自类设置

关于定位中left和right,top和bottom的权重问题的更多相关文章

  1. css 样式中 margin padding和top类定位的区别

    1 margin margin 是外边距的意思,是边框到外部另一元素之间的距离,允许使用负值 语法结构: margin:5px auto;                  意思上下为5,左右平均居中 ...

  2. 深入理解CSS定位中的偏移

    × 目录 [1]定位 [2]包含块 [3]偏移属性[4]绝对定位[5]格式化 [6]auto 前面的话 CSS有三种基本的定位机制:普通流.浮动和绝对定位.利用定位,可以准确地定义元素框相对于其正常位 ...

  3. 【转】深入理解CSS定位中的偏移

    前面的话 CSS有三种基本的定位机制:普通流.浮动和绝对定位.利用定位,可以准确地定义元素框相对于其正常位置应该出现的位置,或者相对于父元素.另一个元素甚至浏览器窗口本身的位置.但元素究竟如何定位,定 ...

  4. CSS定位中“父相子绝”

    一.定位的介绍 定位有三种:相对定位(position:relative).绝对定位(position:absolute).固定定位(position:fixed) 二.三种定位的用法,特点和实例 2 ...

  5. css定位中的百分比

    ----转载自自己在牛人部落中的相关文章--- 在前端css定位中经常面对的一个问题是,百分比定位究竟是针对于谁定位? 一.margin,padding的百分比 首先从css的设计意图说起,在浏览器默 ...

  6. js代码中的parent,top和self有什么区别

    .parent常用在iframe和frame中的子页面访问父页面中的对象 .top :一个页面可能会有很多层,top是指最顶层的框架 .self :是指当前窗口

  7. Sql语句中使用参数化的Top

    在sql中使用参数化的Top,Top后面的参数要用括号括起来. 例如: select top (@ts) ID, [Type], Title, Content, LinkMan, Tel, Check ...

  8. Linux中系统检测工具top命令

    Linux中系统检测工具top命令 本文转自:https://www.cnblogs.com/zhoug2020/p/6336453.html 首先介绍top中一些字段的含义: VIRT:virtua ...

  9. Linux课程---12、linux中内存指令(top命令的作用是什么)

    Linux课程---12.linux中内存指令(top命令的作用是什么) 一.总结 一句话总结: top实时观察进程.内存和CPU情况 1.电脑出现反应慢情况,最先想到的是什么? 内存 2.linux ...

随机推荐

  1. python性能优化、内存优化、内存泄露;与其他语音比较效率如何?

    1.内存泄露:http://www.cnblogs.com/xybaby/p/7491656.html 2.内存优化:http://www.cnblogs.com/xybaby/p/7488216.h ...

  2. 传智播客ADO.Net项目开发教程具体解释

    内容简单介绍: 本教程为传智播客.Net培训课堂的现场录像,请到140623ls" target="_blank">传智播客.Net学院下载很多其它免费.Net视频 ...

  3. VS打包部署图文具体步骤及程序防卸载的制作(password验证卸载)

    1.  在vs2010 选择"新建项目->"其它项目类型"->" Visual StudioInstallerà "安装项目": ...

  4. TCP/IP具体解释学习笔记——数据链路层(2)

    五 Wireless LANs(Wi-Fi) 现在很流行的一种接入互联网的方式就是Wi-Fi了.我们用的ipad.手机.笔记本电脑等等都能够用这样的方式接入互联网,很方便灵活.一个典型的Wi-Fi网络 ...

  5. POJ 3281 Dining(最大流)

    POJ 3281 Dining id=3281" target="_blank" style="">题目链接 题意:n个牛.每一个牛有一些喜欢的 ...

  6. hdu1115 Lifting the Stone(几何,求多边形重心模板题)

    转载请注明出处:http://blog.csdn.net/u012860063 题目链接:pid=1115">http://acm.hdu.edu.cn/showproblem.php ...

  7. 2016/1/25 多线程 作业 方法一 继承Thread 方法二 实现Runnable 多线程笔记

    /* * 1,尝试定义一个继承Thread类的类,并覆盖run()方法, * 在run()方法中每隔100毫秒打印一句话.*/ package Stream; //方法一 继承Thread 实现多线程 ...

  8. Codeforces Round #344 (Div. 2) E. Product Sum 二分斜率优化DP

    E. Product Sum   Blake is the boss of Kris, however, this doesn't spoil their friendship. They often ...

  9. ios34---GDC,dispatch_once

    // // ViewController.m // 09-掌握-GCD常用函数 // // Created by xiaomage on 16/2/18. // Copyright © 2016年 小 ...

  10. hdoj--5526--欧拉回路(欧拉回路)

     欧拉回路 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) Total Su ...