zoukankan      html  css  js  c++  java
  • 切图,css注意事项

    1.文字尽量不要独立放在div中,一般放在p,span中(显得不专业)

    2.div给了width就不要用padding-left,padding-right;给了height就不给padding-top,padding-bottom;margin不受影响 (继承的另说,继承可以这样写,但是padding-XXX和width不要同时出现在一个样式上,会导致不兼容)。  两个相邻的div,上面的一个给了margin-bottom,下面的那个就不要给margin-top了,给了也没用。

    3.img在ie中可能会出现一个边距,border,padding, margin等都消除不了,其实这是ie的一个bug,在img标签上加一个display:block;样式就ok了。

    4.清除浮动(float的使用会导致一些不按预期显示问题)有三种方法如下:

    ① 投机取巧法

        就是直接一个<div style="clear:both;"></div>放到当作最后一个子标签放到父标签那儿,此方法屡试不爽,兼容性强,使用方便,是初学时使用的上佳之选。但是我从来不用,因为我看到的是个巨大的浪费,浪费了一个标签,而且只能使用一次,我个人是无法容忍的,所以这个方法不推荐。而且有时候一不留神中间多了个空格会产生一段空白高度的。

    ②overflow + zoom方法

    .fix{overflow:hidden; zoom:1;}

        此方法优点在于代码简洁,涵盖所有浏览器,可谓不错的选择啊。不过也是有问题的,就是这个overflow:hidden;是个小炸弹,要是里面的元素要是想来个margin负值定位或是负的绝对定位,岂不是直接被裁掉了,所以此方法是有不小的局限性的。我一般不用这个方法,只是有时候顺便去除浮动时用用。

    ③after + zoom方法

        先来简单讲讲after,所谓after,就是指标签的最后一个子元素的后面。于是呢,我们可以用CSS代码生成一个具有clear属性的元素,其中的关键样式就是content了。或许您从网上看到的content里面的内容是”.”一个点,我了很多次,貌似随便写什么东西都没有问题,比如content:'clear both';没问题,或是content:'佰亿'也是ok的。于是有:.clr{zoom:1;}
    .clr:after{display:block; content:'clear'; clear:both; line-height:0; visibility:hidden;}

        这里的line-height:0写成height:0也是可以的。此方法可以说是综合起来最好的方法了,我都是用这个样式清除浮动的,不会影响任何其他样式,通用性强,覆盖面广,我很推荐哦。

  • 相关阅读:
    猴子得到一堆桃,当天吃了一半之后,又多吃了1个。以后每天,猴子都吃了剩余的一半桃子之>后,又多吃一个。在第10天,只剩下1个桃子。输出这堆桃最初有多少个。
    打印9 9乘法表
    尝试实现一个管理系统, 名字和电话号分别用两个列表存储 =======通讯录管理系统======= 1.增加姓名和手机 2.删除姓名 3.修改手机 4.查询所有用户 5.根据姓名查找手机号 6.退出
    求结果
    背景流动
    1
    zuoye
    假期 作业1220
    python1217作业
    pythonzuoye20181212
  • 原文地址:https://www.cnblogs.com/yichengbo/p/3399457.html
Copyright © 2011-2022 走看看