欢迎各位兄弟 发布技术文章

这里的技术是共享的

You are here

首页

div+css

shiping1 的头像

css 清除浮动

星期五, 2013-08-02 14:28 — shiping1

1)清除浮动
父元素{
    height: 1%;
    overflow: hidden;
}
子元素{
float:left;
}

2)清除浮动
最后一个子元素后<div style="clear:both"></div>

第二种方法这个好像是比较好 但是有时ie6好像有点问题,所以......两者结合起来使用吧

 

css清除浮动大全，共8种方法

清除浮动 是每一个 web前台设计师 必须掌握的机能。

 

为什么浮动这么难？

因为浮动会使当前标签产生向上浮的效果，同时会影响到前后标签、父级标签的位置及 width height 属性。

而且同样的代码，在各种浏览器中显示效果也有可能不相同，这样让清除浮动更难了。

 

解决浮动引起的问题有多种方法，但有些方法在浏览器兼容性方面还有问题。

 

普通分类: 
div+css
shiping1 的头像

ie6下img的onclick事件好像不起作用

星期四, 2013-08-01 19:20 — shiping1

ie6下img的onclick事件好像不起作用

下面的这个方法 是可以应付 ie6下img的onclick事件好像不起作用

 

<a href="#" class="chachaa" onclick="closeshow();return false;"><img src='{dede:global.cfg_templets_skin/}/images/fzzy/chacha.png' alt="爱丁堡艺术服装学院" class="chacha" /></a>

 

 

下面这个也可以

<a href="javascript:void(0);" class="chachaa" onclick="closeshow();return false;"><img src='{dede:global.cfg_templets_skin/}/images/fzzy/chacha.png' alt="爱丁堡艺术服装学院" class="chacha" /></a>

 

 

 

普通分类: 
div+css
shiping1 的头像

ie6 png透明 有自己的方法

星期四, 2013-08-01 18:26 — shiping1

下面是自己的方法
<!--[if IE 6]>
<SCRIPT type=text/javascript src="{dede:global.cfg_templets_skin/}/js/DD_belatedPNG.js" ></SCRIPT>
<script type="text/javascript" >
    DD_belatedPNG.fix('img,.zhuyeming,');
</script>
<![endif]-->

http://www.wangchao.net.cn/bbsdetail_1884060.html
http://www.unovo.cn/u-development/XHtml/2009/ie6-fix-png.html

普通分类: 
div+css
shiping1 的头像

IE兼容性bug汇总

星期四, 2013-08-01 18:17 — shiping1

IE兼容性bug汇总

项目最新版本的开发进入后期阶段，今天鼓起勇气打开IE Test，如我所料啊！页面在IE6下面目全非了，呜呜~~

现在开始修复IE的Bug（大部分是IE6，IE7 8也有一些），顺便记录下来。

     1、png图片在IE6下出现透明或背景变灰的bug;

普通分类: 
div+css
shiping1 的头像

ie6bug 好像 子元素是float 父元素就不能是relative

星期四, 2013-08-01 18:03 — shiping1

ie6bug 好像 子元素是float 父元素就不能是relative

普通分类: 
div+css
shiping1 的头像

IE6终极备忘：修复IE6下 25+ Bugs

星期四, 2013-08-01 17:53 — shiping1

[译]IE6终极备忘：修复IE6下 25+ Bugs

2010年01月08日 | HTML/CSS, JavaScript

去年就想将IE的bug系统地整理下，但一直都很忙没有完成，看到这篇E文后，我毫不犹豫的放下了手中的工作将之翻译出来。
由于是第一次译文，所以错误在所难免，欢迎大家批评指正。

普通分类: 
div+css
shiping1 的头像

jquery 根据 id,class,标签 取得对象

星期二, 2013-07-30 08:46 — shiping1

jQuery(document).ready(function(){

       jQuery('.xyhjrelaimg').click(function()
           {
            alert(111);
               //jQuery(this).siblings('div').css('display','');
               //jQuery(this).css('display','none');
               //alert('mouse over event');
           });
    });

 

 

 jQuery根据ID、CLASS、等获取对象

Jquery是继prototype之后又一个优秀的Javascrīpt框架。它是轻量级的js库(压缩后只有21k) ，

普通分类: 
div+css
shiping1 的头像

CSS自动换行,强迫不换行 强制不换行 有大用

星期一, 2013-07-29 16:08 — shiping1

自动换行

普通分类: 
div+css
shiping1 的头像

vertical-align

星期六, 2013-07-27 13:59 — shiping1

CSS vertical-align 属性

CSS 参考手册

定义和用法

vertical-align 属性设置元素的垂直对齐方式。

说明

该属性定义行内元素的基线相对于该元素所在行的基线的垂直对齐。允许指定负长度值和百分比值。这会使元素降低而不是升高。在表单元格中，这个属性会设置单元格框中的单元格内容的对齐方式。

普通分类: 
div+css
shiping1 的头像

前端学习

星期六, 2013-07-27 13:56 — shiping1

!!!记住一定要清除浮动.txt

background:url(../images/logobg.jpg) rrepeat-x left top;

 

我们有时发现ie6的margin不起作用
我们就把ie6的这个元素设置成float:left

 

当高度不变时 line-height:越小越朝上,等于高度时在中间 ,越大 越朝下 ,

 

div 在 object上面

 1)<object里增加  <param value="transparent" name="wmode">

2)embed标签可以在标签中加入  wmode="transparent"  
好像是两个加起来才有用

 

普通分类: 
div+css
shiping1 的头像

幻灯片例子

星期三, 2013-07-10 14:44 — shiping1

1) http://moko.cc

普通分类: 
div+css
shiping1 的头像

CSS white-space 属性 不换行 同一行

星期六, 2013-07-06 18:49 — shiping1

CSS white-space 属性

普通分类: 
div+css
shiping1 的头像

怎么解决IE6下 li 的 float:left 自动换行？

星期六, 2013-07-06 18:46 — shiping1

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
* {margin:0; padding:0; font-size:12px;}
ul {list-style:none;}
#nav {width:180px; height:200px; border:1px solid red;}

普通分类: 
div+css
shiping1 的头像

css background rgba 在 ie

星期四, 2013-06-27 13:18 — shiping1 
普通分类: 
div+css
  


  

          

    
      







    

    shiping1 的头像  


        
解决IE6浏览器下position:fixed固定定位问题

    
      星期四, 2013-06-20 12:23 — shiping1
  
  

    
解决IE6浏览器下position:fixed固定定位问题
发布于:2011-10-05 18:07 | 点击:113 | 评论:0
使元素固定在浏览器的顶部：#top{
_position:absolute;
_bottom:auto;
_top:expression(eval(document.documentElement.scrollTop));
}使元素固定在浏览器的底部：#top{
_position:absolute;
_bottom:auto;
_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));
}这两段代码只能实现在最底部跟最顶部，你可以使用 _margin-top:10px; 或者 _margin-bottom:10px; 修改其中的数值控制元素的位置。
普通分类: 
div+css
  


  

          

    
      







    

    shiping1 的头像  


        
css  background

    
      星期四, 2013-06-20 09:54 — shiping1
  
  

    
RGBA像RGB一样设置颜色，而这个”A”——RGBA中的最后一个值——允许我们设置该元素的透明度。就像opacity声明一样，一个opacity值为1的元素是完全不透明的，而一个opacity为0的元素是完全透明的。
普通分类: 
div+css
  


  

          

    
      







    

    shiping1 的头像  


        
img  图像丢失

    
      星期五, 2013-06-14 19:55 — shiping1
  
  

    
img  图像丢失 onerror
<img src="{{$row.userhead}}"
        onerror="this.onerror=null;this.src='http://u.szr.com/images/face/none.gif'"
        width="20" height="20" alt="{{$row.username}}的照片" />
普通分类: 
div+css
  


  

          

    
      







    

    shiping1 的头像  


        
CSS outline 属性

    
      星期五, 2013-06-07 14:48 — shiping1
  
  

    
普通分类: 
div+css
  


  

          

    
      







    

    shiping1 的头像  


        
input 文本框 按钮用背景图

    
      星期四, 2013-06-06 22:10 — shiping1
  
  

    
1)background 背景图
2)border:none;
 
也能用 1)它的父元素用background 背景图
普通分类: 
div+css
  


  

          

    
      







    

    shiping1 的头像  


        
css 背景透明 

    
      星期四, 2013-06-06 22:06 — shiping1
  
  

    
普通分类: 
div+css
  


  

          

    
      







    

    shiping1 的头像  


        
CSS border-style 

    
      星期六, 2013-06-01 16:58 — shiping1
  
  

    
普通分类: 
div+css
  


  

          

    
      







    

    shiping1 的头像  


        
css ie 自己亲自做的  有大用

    
      星期三, 2013-05-29 13:50 — shiping1
  
  

    
/*  \9 是仅对IE起作用*/
margin-top:10px; margin-bottom:10px\9;




/* 下面这些在 css 要严格按顺序  */

width:150px;            /*普通浏览器*/
width\0:140px ;         /*为ie8*/
*+width:130px ;         /*为ie7*/

_width:120px ;  或者     *width:120px ;   /*为ie6*/

(*width:120px ; 假如没有 *+时,也对 IE7起作用)
(_width:120px ; 假如没有 *+时,也仅对 IE6起作用)






/*只适用于ie6,好像是不适用于ie7 */
*html  .aaaa{
width:140px;
}

*html{
background-image:url(about:blank);
background-attachment:fixed;
普通分类: 
div+css
  


  

          

    
      







    

    shiping1 的头像  


        
CSS实现跨浏览器兼容性的盒阴影效果

    
      星期三, 2013-05-29 12:27 — shiping1
  
  

    
一、无关紧要碎碎念
在web页面的ui表现中，投影效果可以说是非常常见的一种表现效果了。例如开心网的头像修饰效果：
开心网头像投影效果 张鑫旭-鑫空间-鑫生活
然而，在CSS2的时代，我们多半使用图片实现类似效果，或是使用CSS其他属性模拟阴影效果，但是，现在，CSS3的崛起使得这个问题已经不再是是个问题了，本文就将展示如何实现跨浏览器的盒阴影效果。
二、标准方法
标准方法当然就是指使用CSS3的方法了，这个应该不少同行应该知道，参见如下代码：
普通分类: 
div+css
  


  

          

    
      







    

    shiping1 的头像  


        
html链接到邮箱

    
      星期二, 2013-05-21 10:15 — shiping1
  
  

    
<a href="mailto:1052889979@qq.com" >校长信箱</a>
普通分类: 
div+css
  


  

          

    
      







  
        
各种页面高度

    
      星期四, 2013-05-09 10:28 — adminshiping1
  
  

    
CSS专题（三）：页面高度发微
一 背景
　　本文不讨论普通元素的大小和位置，仅仅讨论页面的大小和位置，而且为了简化问题，本文只讨论高度与顶部距离。笔者发现，页面的宽度与高度的表现有很多不同，细心的朋友会发现，故页面宽度另起文讨论，文章已经写好，见页面宽度发微。
普通分类: 
div+css
  


  

          

    
      







  
        
table 边框  及  边框颜色  有大用

    
      星期二, 2013-05-07 20:17 — adminshiping1
  
  

    
第0种  表格边框的一种方法
普通分类: 
div+css
  


  

          

    
      







  
        
div在object上面 透明效果 遮挡 覆盖 

    
      星期日, 2013-05-05 18:54 — adminshiping1
  
  

    
div在object上面
 
 1)<object里增加  <param value="transparent" name="wmode">

2)embed标签可以在标签中加入   wmode="transparent" 
(如果不行的话 再加上 value="transparent" )
好像是1)和2)两个加起来才有用
普通分类: 
div+css
  


  

          

    
      







  
        
top 固定在网页头部

    
      星期日, 2013-05-05 18:12 — adminshiping1
  
  

    
//普通浏览器 固定在网页头部
#top{
    position:fixed;
    left :0px;
    top:0px;
}
//ie6 固定在网页头部
#top{
_position:absolute;
_bottom:auto;
_top:expression(eval(document.documentElement.scrollTop));
}
普通分类: 
div+css
  


  

          

    
      







  
        
颜色代码颜色代码大全视图参照表对照表

    
      星期四, 2013-05-02 22:37 — adminshiping1
  
  

    
颜色代码
#ccc, #666灰色
#FF0000 红色
 
普通分类: 
div+css
  


  

          

    
      







  
        
无法确定html元素时 我们加上边框或背景颜色

    
      星期四, 2013-05-02 16:35 — adminshiping1
  
  

    
无法确定html元素时 我们加上边框 border 或背景颜色 background
普通分类: 
div+css
  


  

          

    
      





页面
  



  

          

          Subscribe to RSS - div+css            

    


    
  

    Powered by Drupal  






    
友情链接

  
  

    
校园好文网

  






    
  

    
 www.shipingzhong.cn  个人技术网_前端_后台    备案号:苏ICP备18010659号-2