日志分类

让FCKeditor插入的图片自动缩小

图片按照比例缩小 javascript:

Javascript 代码 :

<script language="JavaScript">  
<!–  
window.onload=fiximage;  
function fiximage() {  
    var max=600;  
    imgs = document.getElementsByTagName(‘img’);  
    for(i=0;i<imgs.length;i++) {  
    w=imgs[i].width;h=imgs[i].height;  
    if(w>max) { imgs[i].width=max;imgs[i].height=h/(w/max);}  
    }  
}  
//–>  
</script>  

可用于解决撑大模板的问题

为页面添加背景图片

     background-image: url(图片); 插入图片
     background-repeat: no-repeat/repeat-x/repeat-y 控制图片重复方式,默认是平铺也就是既repeat-x又repeat-y

     background-position:right top; 控制图片的位置先x 后y

     或者可以用简写形式:

     background: url(图片) fixed left top repeat;

Margin,Padding,Border,CSS的盒模型

     学习完了CSS的盒模型,Margin 就是最外层与其他标签相接的部分,并且是可以重叠的,如果2个标签的Margin重叠则一般是选用较小标签的Margin值,Border就是边框了,可是设定粗细和颜色,并且可以用来凸现重要标题并用于布局中,Padding就是边框和内容之间的距离,如果你不设定这三个值那么浏览器会按照他自己的默认设置来设定这三者。

     另外经常会遇到的一个问题就是文本框的溢出处理,这个是使用overflow属性,一般有4个选择,默认是visible跟没设定一样,scroll就是不关怎么样都会显示一个滚动条,auto应该算是最常用了,按照需求产生滚动条,hidden也比较常用,直接隐藏超出范围的部分。

      然后就是有关IE6的一些BUG属性的控制使用* html 标签 {} 来进行特殊指定,另外对于overflow: hidden; 属性阻止背景和边框很难看的在浮动元素下方跑动的时候,IE5,IE6却不能正确处理这些属性,这个时候就需要添加* html h2 {zoom: -1;} 本来是用于放大网页中的一个元素的,但这里用来欺骗IE5,IE6来阻止背景延伸到浮动元素的下面。

标准化HTML网页的利器

     最近学习CSS+DIV看书的时候发现了快速检测网页是否符合W3C标准的一个工具就是 Firefox 的扩展 Html Validator 使用很方便, 可以在 http://users.skynet.be/mgueury/mozilla/ 下载到该工具的最新版本,使用很简单,重启Firefox以后会有提示问你用什么检测方法,我选择的是Seril就是2种都使用,这样制作出的网页更规范。

      使用的时候只要在目标网页上单击右键选择查看源代码就可以了,会有提示和解决方法,很好的东西,独乐乐不如众乐乐,呵呵