zoukankan      html  css  js  c++  java
  • css tips 1(不太正规,随手记)

    1. debug 技巧
        去除之前引入的css文件
        去除不必要的dtd(诸如eclipse建的jsp文件自带的dtd声明,会引发一些问题)
        netbeans  能自动提示 能告诉你非标准标签   能找到你缺的半边div 或者table之类的  (举个例子  就是你有4个<div>  但是你只有3个</div>  当你页面上的元素很多 几百行时 找起来就困难了  用netbeans就很容易发现  他会提示的)

    2. 块级元素 线性元素
        display none block inline

    3. document.getElementById("testdiv").style.display
    当你将这个display定义在css中  那么在ie下  用js执行上述语句是取不到值的
    要写成这样  <div style="display:block"></div>
    这样用上面的js就能读到display的值了
    当然je上也有人说了一些在firefox下面的处理办法

    4. 水平居中的问题
    具体参考 编写高质量的代码 前端

    5. 表格内文字在ie下自动换行的问题
    table上加样式  layout:fix
    td上加样式 word-break:....
    具体的上网搜一下


    6. overflow

    7. className的操作
    prototype库对此有很良好的封装 addClassName removeClassName
    对于用于JS操作的className 建议加上J_前缀,以做区分
    prototype支持 用$$(.....) ....是css支持的选择器
    如:$$(#testEleID .testClass)
    在页面上找出id为testEleID的元素中所包含的类名含有testClass的所有元素
    并且prototype对于这些返回集合数组的操作,若找不到,不会返回undefined,而是返回“空数组”  正如java上所说,尽量返回空列表,不要返回null

    8.超链接样式的定义顺序  love hate    即  link visited hover active
    否则会出现点击后样式丢失的问题

    看的书

    <<

    编写高质量代码

    >>

    http://book.douban.com/subject/4881987/

    我的评论

    《实战,经验不太丰富的前端开发快速提升》

    http://book.douban.com/review/4898883/

    //Add on 2012-03-18

    9. 高度自适应(随浏览器大小自适应)

    《CSS网站布局实录(第2版)》 P76

    html 和body都要设置height为100%

    然后div再设置height为100%

    这样就能达到效果

    html,body{
    font-size:12px;
    height:100%;
    }


    <body>
    <div style="height:100%;min-height:400px;border:1px solid red;">

    </div>

    </body>


    10. css设置最小高度 然后自适应

    min-height:400px; height:auto!important; height:400px;

    参考:http://www.daqianduan.com/css-height/

    11. 左栏宽度固定 右栏宽度自适应在firefox下有问题

    #right{height:100%;overflow:hidden;zoom:1;}
    #left{height:100%;240px;float:left;}
    要在右栏上加上overflow:hidden; 否则firefox下有问题

    参见http://hikejun.com/blog/2011/10/26/%E8%BF%91%E6%9C%9F%E9%9D%A2%E8%AF%95%E6%84%9F%E5%8F%97/


    12. div重叠在table上面

    请教个问题啊 div能不能重叠在table上面   div设置成position: absolute
    JS-豪情  15:38:24
    可以重叠在上面。但是除div设置定位,left,top值之外,上一级父容器还要设置成position:relative; 要不然没有重叠的效果。



  • 相关阅读:
    dev GridControl 代码自定义下拉框
    字符串utf-8相互转换
    .net 相关
    dev grid 样式
    winform 重置快捷写法
    winform 代码定义事件
    winform设置默认打印机
    可为空的对象必须具有一个值
    js获取当前日期之前或之后数据
    sql 快捷方法使用
  • 原文地址:https://www.cnblogs.com/simoncook/p/2046555.html
Copyright © 2011-2022 走看看