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

这里的技术是共享的

You are here

首页

div+css

shiping1 的头像

IE6 Select元素无法被div等元素覆盖的bug解决办法 iframe 里面 有内容 东西

星期五, 2013-08-30 20:10 — shiping1
 

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

ie6 ie7 好像 高度 行高 起作用必须是 display:block

星期五, 2013-08-30 18:30 — shiping1

ie6 ie7 好像 高度 行高 起作用必须是 display:block

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

CSS visibility 属性

星期五, 2013-08-30 17:47 — shiping1

CSS visibility 属性

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

ie7 bug

星期三, 2013-08-21 17:56 — shiping1

有的时候 position:absolute 下面 还有 position:absolute的层时

如果 ie7的话 里面的 position:absolute的层 就不会显示,也就是不会在最上面,

我们给它个背景就可以了 background:#fff;
 filter:  alpha(opacity=1);//ie

  opacity: 0.01;//firefox

同时 让它的透明度为 一点点

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

ie6 png 透明的各种方法

星期二, 2013-08-20 09:15 — shiping1

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

HTML <th> 标签 HTML <thead> 标签

星期六, 2013-08-17 18:50 — shiping1

HTML <th> 标签

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

css中指定tr边框 正常情况下tr边框好像不起作用

星期六, 2013-08-17 18:42 — shiping1

你可能发现在css中指定的tr边框不起作用，而如果指定td的边框又会有间断的现象出现。这种情况下可以参照下面的代码：

 

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

text-indent 首行缩进 的用法

星期六, 2013-08-17 16:05 — shiping1

允许使用负值。如果使用负值，那么首行会被缩进到左边。

 

text-indent:2em 就是首行缩进2个字

text-indent:10px 就是首行缩进10个像素

 

text-indent:-9999px; 隐藏文字，

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

CSS letter-spacing 属性 字间距

星期五, 2013-08-16 09:09 — shiping1

CSS letter-spacing 属性

CSS 参考手册

定义和用法

letter-spacing 属性增加或减少字符间的空白（字符间距）。

该属性定义了在文本字符框之间插入多少空间。由于字符字形通常比其字符框要窄，指定长度值时，会调整字母之间通常的间隔。因此，normal 就相当于值为 0。

注释：允许使用负值，这会让字母之间挤得更紧。

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

css 斜体

星期四, 2013-08-15 11:04 — shiping1

CSS font-style 属性

CSS 参考手册

定义和用法

font-style 属性定义字体的风格。

说明

该属性设置使用斜体、倾斜或正常字体。斜体字体通常定义为字体系列中的一个单独的字体。理论上讲，用户代理可以根据正常字体计算一个斜体字体。

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

图像在div 内垂直居中 绝对ok 纯CSS实现图片水平垂直居中于DIV（图片未知宽高）

星期一, 2013-08-12 19:27 — shiping1

一个问题一直困扰着不少前端制作人员（也称前端开发工程师，o(∩_∩)o）。如题，如何实现一张未知宽高的图片在一个Div里面水平垂直 居中呢？相信部分前端Sir首先想的是Table布局，是的，实现起来不是很麻烦，但肯定也有和浩子一样有代码洁癖的人。在这里，浩子忽略Table的实 现方法，有兴趣的也可以去研究一下。下面介绍下用Html和CSS来实现如题效果。

先看看Demo效果：纯CSS实现图片水平垂直居中于DIV（图片未知宽高）

PS：你可以用Firebug或者任意浏览器的开发人员工具修改图片尺寸，测试测试效果。（任何关于本文的问题请留言）

再看看代码，主要2部分：

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

图像在div 内垂直居中

星期一, 2013-08-12 19:17 — shiping1 
1)一种方法
<!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=GB2312" />
<title>无标题文档</title>
<style type="text/css">
.psdthumb { height: 1%; overflow: hidden; display:table; border-spacing:10px; }
普通分类: 
div+css
shiping1 的头像

图像加载完毕前 显示 等待的图像

星期一, 2013-08-12 18:28 — 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>
<style>
img{
width:980px;
height:350px;
background:loading.gif;
}
</style>
<body>

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

纯CSS图片预加载

星期六, 2013-08-10 18:56 — shiping1

有很多种方法来实现图片的预加载，通常大部分使用Javascript让事情滚动。不要再受Javascript预载的束缚了吧，用CSS你就可以毫不麻烦的预载你的图片。

 

为什么使用预载

你为什么会考虑使用预载呢？你是否曾有个网站，在那个网站你要滚动你的导航然后有个延迟直到图片被加载完……嘿嘿。预载将在这方面帮助你。它将在页面加载的时候加载那些图片并将其存储在浏览器的缓存里面。这样当用户滚动导航的时候，很漂亮而且流畅，没有延迟。

CSS代码

这个概念就是写一个CSS样式设置一批背景图片，然后将其隐藏，这样你就看不到那些图片了。那些背景图片就是你想预载的图片。

这是一个例子:

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

embed noembed 例子

星期六, 2013-08-10 18:23 — shiping1

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

ie6 背景

星期六, 2013-08-10 15:32 — shiping1

为什么这里 src不对

.fancybox-ie6 #fancybox-close { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancy_close.png', sizingMethod='scale'); }

为什么这里 src是对

.fancybox-ie6 #fancybox-close { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/templets/shipingzhong/style/fancybox/fancy_close.png', sizingMethod='scale'); }

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

袁绍锋 绍锋 object embed 例子 及播放 其它的如flv 等的例子 video swf 有大用

星期二, 2013-08-06 14:14 — shiping1

本机电脑上 D:\xampp\htdocs\ZZZZ\javascript\flash2 文件夹有很多的例子

最好同源 swf文件jpg文件flv(mp4)文件同一网站下

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

object参数大全

星期二, 2013-08-06 09:08 — shiping1

object参数大全

(默认0为否，-1或1为是)
<object classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95" id="MediaPlayer1" width="286" height="225">
<param name="AudioStream" value="-1">
<param name="AutoSize" value="-1">
<!--是否自动调整播放大小-->
<param name="AutoStart" value="-1">
<!--是否自动播放-->
<param name="AnimationAtStart" value="-1">
<param name="AllowScan" value="-1">
<param name="AllowChangeDisplaySize" value="-1">
<param name="AutoRewind" value="0">

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

shadow 阴影 边框阴影 有大用 一条线的阴影效果 有大用

星期一, 2013-08-05 14:57 — shiping1


.shadow {
    -moz-box-shadow: 3px 3px 4px #d0d0d0;
    -webkit-box-shadow: 3px 3px 4px #d0d0d0;
    box-shadow: 3px 3px 4px #d0d0d0;
    -ms-filter\0: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#d0d0d0')";
}
*html  .shadow{
 filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#d0d0d0');
}
*+html  .shadow{
 filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#d0d0d0');
}

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

所有浏览器(包括ie6)都通用顶部固定的 水平居中的代码 有大用

星期六, 2013-08-03 15:57 — shiping1

.zhuangyeshezhi-top{
position:fixed;  /*如果不是固定的可以是absolute绝对定位*/
top:0px;
left: 50%;
margin: 0 auto 0 -495px;/*这里495的为本身宽度的一半即990的一半*/
z-index:100;
background:url(../images/nav.gif) no-repeat left top;
height:38px;
width:990px;
_position:absolute;
_bottom:auto;
_top:expression(eval(document.documentElement.scrollTop));    
}

 

 

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

html 显示 swf文件

星期六, 2013-08-03 15:30 — shiping1

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/html40/loose.dtd">
<html>
  <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="author" content="Administrator">
    <meta name="generator" content="SWiSH Max3 (2009.11.30) www.swishzone.com">
    <meta name="description" content="">

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

css 背景固定

星期六, 2013-08-03 10:26 — shiping1

css背景固定 background-attachment:fixed;

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

ps 切图

星期五, 2013-08-02 15:40 — shiping1
PS切图的相关技巧
一，基本概念
1，切图，是一种网页制作技术，他是将美工效果图转换为页面效果图的重要技术。Fireworks也提供了切图技术，Flash则直接提供了网页格式输出技术（不需要切图）。
2，切片，是切图的直接结果，切图实际上就将图切分为一系列的切片
二，切图操作过程
1，切图工具图标的识别
普通分类: 
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

页面

Subscribe to RSS - div+css
Powered by Drupal

友情链接

校园好文网

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