zoukankan      html  css  js  c++  java
  • div+CSS编程技巧

    9、定义链接的四种状态要注意先后顺序: Link Visited Hover Active 

    10、与内容无关的图片请使用background

    15、完美的单象素外框线表格(在IE5、IE6、IE7及FF1.0.4以上中均可通过测试) table{border-collapse:collapse;} td{border:#000 solid 1px;}

          方法二:table{border-top:1px solid red; border-left:1px solid red;}td{ border-bottom:1px solid red; border-right:1px solid red;}

    16、margin取负值可以在标签使用绝对定位的时候起到相对定位的作用,在页面居中显示时,使用绝对定位的层不适合使用left:XXpx这个属性。把这个层放到一个要相对定位的标签旁,然后使用margin的负值是个好方法。

    17、绝对定位时使用margin值定位可以达到相对于本身所在位置的定,这与top,left等属性相对与窗口边缘的定位不同。绝对定位的优势在于可以让其它元素忽略它的存在。

    18、如果文字过长,则将过长的部分变成省略号显示:IE5,FF无效,但可以隐藏,IE6有效 <DIV STYLE=”120px;height:50px;border:1px solid blue;overflow:hidden;text-overflow:ellipsis”> <NOBR>就是比如有一行文字,很长,表格内一行显示不下.</NOBR>

    19、在IE中可能由于注释带来的文字重复问题时可以把注释改为: <!?[if !IE]>Put your commentary in here…<![endif]?>

    20、如何用CSS调用外部字体 语法: @font-face{font-family:name;src:url(url);sRules} 取值: name:字体名称。任何可能的 font-family 属性的值 url(url):使用绝对或相对 url 地址指定OpenType字体文件 sRules:样式表定义

    21、如何让一个表单中的文本框中的文字垂直居中? 如果用行高与高度的组在FF中是没有效果的,办法就是定义上下补白就可以实现想想的效果了。

    22、定义A标签要注意的小问题: 当我们定义a{color:red;}时,它代表了A的四种状态的样式,如果此时要定义一个鼠标放上的状态只要定义a:hover就可以了,其它三种状态就是A中所定义的样式。 只定义了一个a:link时,一定要记得把其它三种状态定义出来!

    23、并不是所有样式都要简写: 当样式表前定义了如p{padding:1px 2px 3px 4px}时,在后续工程中又增加了一个样式上补白5px,下补白6px。我们并不一定要写成p.style1{padding:5px 6px 3px 4px}。可以写成p.style1{padding-top:5px;padding-right:6px;},你可能会感觉这样写还不如原来那样好,但你想没想过,你的那种写法重复定义了样式,另外你可以不必去找原来的下补白与左补白的值是多少!如果以后前一个样式P变了话,你定义的p.style1的样式也要变。 

    24、网站越大,CSS样式越多,开始做前,请做好充分的准备和策划,包括命名规则。页面区块划分,内部样式分类等。

    25、几个常用到的CSS样式:
    -1)中文字两端对齐:text-align:justify;text-justify:inter-ideograph;

    -2)固定宽度汉字截断:overflow:hidden;text-overflow:ellipsis;white-space:nowrap;(不过只能处理文字在一行上的截断,不能处理多行。)(IE5以上)FF不能,它只隐藏。

    -3)固定宽度汉字(词)折行:table-layout:fixed; word-break:break-all;(IE5以上)FF不能。

    -4)<acronym title=”输入要提示的文字” style=”cursor:help;”>文字</acronym>用鼠标放在前面的文字上看效果。这个效果在国外的很多网站都可以看到,而国内的少又少。

    -5)图片设为半透明:.halfalpha { background-color:#000000;filter:Alpha(Opacity=50)}在IE6及IE5测试通过,FF未通过,这是因为这个样式是IE私有的东西;

    -6)FLASH透明:选中swf,打开原代码窗口,在</object>前输入<param name=”wmode” value=”transparent”> 以上是针对IE的代码。 针对FIREFOX 给<embed> 标签也增加类似参数wmode=”transparent”

    -7)在做网页时常用到把鼠标放在图片上会出现图片变亮的效果,可以用图片替换的技巧,也可以用如下的滤镜: .pictures img { filter: alpha(opacity=45); } .pictures a:hover img { filter: alpha(opacity=90); }

  • 相关阅读:
    HDU 1124 Factorial
    hdu 1690 Bus System
    hdu 1113 Word Amalgamation
    POJ 2482 Stars in Your Window
    hdu 1385 ZOJ 1456 Minimum Transport Cost(经典floyd)
    hdu 1907 John
    VMware 虚拟机 安装 UBuntu 9.10 命令模式转换成窗口模试
    #pragma CODE_SEG __NEAR_SEG NON_BANKED详解
    Ubuntu 下Hadoop 伪分布式 hadoop0.20.2.tar.gz 的安装
    文件拷贝代码以及疑问
  • 原文地址:https://www.cnblogs.com/hfxm/p/2400409.html
Copyright © 2011-2022 走看看