May232013
May232013
详解display:inline;与float:left;的区别
首先我们要明确,display:inline;与float:left;正确含义。display:inline;(内联)《CSS权威指南》中文字显示:任何不是块级元素的可见元素都是内联元素。其表现的特性是“行布局”形式,这里的“行布局”的意思就是说其表现形式始终以行进行显示。比如,我们设定一个内联元素border-bottom:1px solid #000;时其表现是以每行进行重复,每一行下方都会有一条黑色的细线。如果是块级元素那么所显示...阅读全文
May232013
JavaScript和Jquery动态加载Js文件和Css文件
JS 动态加载 CSS 在可换主题的界面中具有很重要的意义,用户可以根据自己的浏览习惯选择自己喜欢的页面显示方式,动态加载 CSS 的方法主要有三种,下面详细说明。如果你有很多关联的CSS文件要一起加载,或者想动态的加载不同的CSS文件,那么下面的方法你一定对你有帮助。
(1)使用JavaScript动态加载Js文件
/*JavaScript动态加载Js文件*/
var scriptNode = document.createElement('sc...阅读全文
May232013
May232013
javascript中scrollHeight,scrollWidth,scrollLeft,scrolltop等区别小解
javascript中scrollHeight,scrollWidth,scrollLeft,scrolltop等区别小解,具体介绍以及使用方法如下:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js位子表示</title>
<script type="text/javascript">
function testClick(oDiv){
var oDivId=document.getElementById(oDiv);
ale...阅读全文
May232013
IE6下实现PNG图片透明
我们都知道使用PNG图片的透明或半透明的特性能做出非常漂亮的网页来。Firefox和Opera对PNG的支持都没问题,都是IE却无视PNG图片这个优秀的特性,虽然现在IE7已经支持了,但是IE6却还是不行。具体的问题就是在IE6中的”.png”格式的图片会无端的被加上了灰色的背景。对于这种问题,网上有很多解决问题的办法,作者经过实践也总结出了几种办法解决这个问题,现记录如下。
(1)...阅读全文
May232013
常见的CSS浏览器兼容性问题
CSS对浏览器的兼容性有时让人很头疼,或许当你了解当中的技巧跟原理,就会觉得也不是难事,从网上收集了IE7,6与Fireofx的兼容性处理方法并整理了一下.对于web2.0的过度,请尽量用xhtml格式写代码,而且DOCTYPE 影响 CSS 处理,作为W3C的标准,一定要加 DOCTYPE声名.
CSS技巧
1.div的垂直居中问题 vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直...阅读全文
May232013
CSS透明效果,兼容IE和firefox
由于遮盖层的崛起,现在网站上使用css透明效果非常的多,对于支持W3C的浏览器,可以使用opacity属性,而在IE下可以使用滤镜filter来实现透明效果,OK,废话不多说,下面我们来写一个通用的CSS透明效果吧,兼容了目前比较流行的IE和firefox浏览器。相关css代码如下:
.setOpacity{
opacity:0.75;
filter:alpha(opacity=75);
-ms-filter:"alpha(opacity=75)";
-khtml-opacity:0.75;...阅读全文
May232013
css中border:none;与border:0;的区别
这问题在网络相信已经有不少人问到,最近再次被牵起讨论,籍此记录一下个人的理解,border:none;与border:0;的区别体现有两点:一是理论上的性能差异二是浏览器兼容性的差异。
1.性能差异
【border:0;】把border设为“0”像素虽然在页面上看不见,但按border默认值理解,浏览器依然对border-width/border-color进行了渲染,即已经占用了内存值。
【border:none;】把border设为“none”即没...阅读全文
May232013
js控制文字大中小显示
部分网站内容页通常会看到有控制文字分别以 大,中,小 三种方式显示,下面就把这个小功能做一下记录,对提高网站用户体验度还是有一些帮助的哦!
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js控制文字大中小显示</title>
</head>
<body>
<script language="javascript">
f...阅读全文