图文混排解决方案

第一种方法：背景图片法

这种方法适用于非动态内容，图片用于装饰的情况下。主要是设置父元素的padding的宽度为背景图片的宽度加上图片和文字的间距，然后把背景图片定位到padding里面就可以了

图文混排demo1，背景图片法

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.

html code

普通分类:

div+css

Read more about 图文混排解决方案

<!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>
* {
margin:0;
padding:0;
}
body {
background:#fff;
}
#wrap {
width:502px;

普通分类:

div+css

Read more about CSS图文混排采用dl dt dd

设置图文混排

星期五, 2013-11-22 16:29 — shiping1

设置图文混排

在文本排版中，如果不进行特殊设置，浏览器就默认对图片和文字分行显示，这显得不大美观。div css图文混排的实现主要通过float属性来控制。

1、图片浮在文字的左边：

普通分类:

div+css

Read more about 设置图文混排

图文混排图像左浮动右浮动

星期五, 2013-11-22 16:04 — shiping1

用CSS实现HTML图文混排

在网页中经常需要文字环绕图片，或文字与图片分开来排列，目前常用的方法是使用表格来定位文字和图片以此来实现。但对于动态的网页，图文混排的格式并不是一成不变的所以要想动态的生成表格来实现图文混排是非常困难的。

在CSS中有二个的属性可以用来实现图文混排。而且可以相对比较方便的实与动态内容相联系，在此我做以简单简绍：

1. float　设定浮动性质（多用于文绕图的情形）

支　持：ＩＥ４、ＮＣ４
适　用：区块元素或图形
可能值： left 元素靠左，文字围绕其右 right 元素靠右，文字围绕其左 none 以预设的方法显示预设值：none
继承性：无

一般范例：DIV { float : right }
同轴范例：<DIV style="float:right">
2.clear　设定清除性质（设定是否允许浮动元素之存在）
支　持：ＩＥ４
适　用：区块元素或图形

普通分类:

div+css

Read more about 图文混排图像左浮动右浮动

css 圆角

星期二, 2013-11-19 13:21 — shiping1

CSS3圆角详解

作者：阮一峰

日期： 2010年12月 9日

CSS3是样式表（style sheet）语言的最新版本，它的一大优点就是支持圆角。

普通分类:

div+css

Read more about css 圆角

文本阴影效果

星期六, 2013-11-16 20:56 — shiping1

.listtitle a {

普通分类:

div+css

Read more about 文本阴影效果

浏览器通用的播放 swf文件

星期六, 2013-11-16 09:05 — shiping1

下面是优酷的代码如果是播放其它的swf文件当然参数要进行一些修改
<embed width="800" height="410" align="middle" flashvars="isAutoPlay=true&winType=index" allowfullscreen="true" allowscriptaccess="always" quality="high" src="http://player.youku.com/player.php/sid/XNjAyMDY5NzA4/v.swf" wmode="transparent">

普通分类:

div+css

Read more about 浏览器通用的播放 swf文件

div内放form,h3 ，之间的距离在IE6中怎么去掉_百度知道

星期五, 2013-11-15 16:26 — shiping1

ie6 ,ie7 里出现这种间距
我们设
在样式表中加上 *{ margin:0px; padding:0px; }
就可以去掉间距了

普通分类:

div+css

Read more about div内放form,h3 ，之间的距离在IE6中怎么去掉_百度知道

LI 和 LI 之间的间距问题，IE6 IE7下有一点间距

星期五, 2013-11-15 16:00 — shiping1

1)第一种解决方法
ul li{ width: 100%; float:left;}

2)第二种解决方法
ul li {display:inline}

来自 http://bbs.csdn.net/topics/320070763

普通分类:

div+css

Read more about LI 和 LI 之间的间距问题，IE6 IE7下有一点间距

IE下模拟css3中的box-shadow 边框（阴影）亲自做的有大用有大大用

星期五, 2013-11-15 15:04 — shiping1

下面的代码是完全好的

横向偏移3像素，纵向偏移3像素，模糊4像素，颜色为纯黑

.xiaozhangshiping {

普通分类:

div+css

Read more about IE下模拟css3中的box-shadow 边框（阴影）亲自做的有大用有大大用

ie background 设为顶部对齐但是事实它顶部不对齐那么就设一下这个div高度

星期一, 2013-11-11 15:20 — shiping1

普通分类:

div+css

Read more about ie background 设为顶部对齐但是事实它顶部不对齐那么就设一下这个div高度

平忠自己认定的js css javascript排放顺序有大用

星期六, 2013-11-02 12:57 — shiping1

1)对性能最重要的影响是执行时间长的内联js代码放到onload方法中或者放在外联js文件中
2)尽量合并外部js,css文件
3)顺序是内联js,内联css,外联css,外联css文件放在</head>前在页面的最下面放外联js文件

普通分类:

div+css

Read more about 平忠自己认定的js css javascript排放顺序有大用

清理css 清除css中无用的样式有大用

星期六, 2013-11-02 12:28 — shiping1

普通分类:

div+css

Read more about 清理css 清除css中无用的样式有大用

text-indent 好像只有在display为block的情况下才起作用

星期五, 2013-11-01 12:41 — shiping1

.qqdianji a{
   text-indent:-9999px;
   display:block;

}

普通分类:

div+css

Read more about text-indent 好像只有在display为block的情况下才起作用

css bacground rgba

星期四, 2013-10-31 09:55 — shiping1

ie好像不认识 rgba(0, 0, 0, 0)
.float_layer .min {
    background: url("../../images/baoming/close.gif") no-repeat scroll 0 bottom rgba(0, 0, 0, 0);
    border: 0 none;
    height: 20px;
    line-height: 20px;
    position: absolute;
     left: 5px;
    top: 207px;
    width: 21px;
   _display:block;
   _background: url("../../images/baoming/close.gif") no-repeat 0px -20px;
}

普通分类:

div+css

Read more about css bacground rgba

CSS3之旅:RGBa颜色

星期二, 2013-10-29 14:12 — shiping1

CSS3之旅:RGBa颜色

神飞发表于 28.

普通分类:

div+css

Read more about CSS3之旅:RGBa颜色

CSS Sprites(CSS图像拼合技术)教程、工具集合 css 贴图定位 css精灵

星期二, 2013-10-29 12:38 — shiping1

来自来自 http://blog.bingo929.com/css-sprites-css-techniques-tools-tutorials.html
CSS Sprites(CSS图像拼合技术)教程、工具集合

2009年05月20日 | 彬Go

普通分类:

div+css

Read more about CSS Sprites(CSS图像拼合技术)教程、工具集合 css 贴图定位 css精灵

多个块标签float:left之后水平居中解决办法

星期一, 2013-10-28 22:03 — shiping1

多个块标签float:left之后水平居中解决办法

大家在用 <li> 标签做一个导航的时候，难免会碰到这个问题， <li> 标签 float:left; 之后，不能居中对齐

下面这两种方法可以解决这个问题。

方法一：

为ul设置上width值，如ul {width:500px} 好像还要加上margin:auto;

普通分类:

div+css

Read more about 多个块标签float:left之后水平居中解决办法

firefox 代理设置

星期日, 2013-10-27 13:21 — shiping1

工具 选项 高级 网络里面设置 也可以用foxyproxy autoproxy等扩展设置

　

FireFox的设置和IE类似，打开FireFox浏览器，选择菜单栏的“工具/选项...”。
　　这时选择“高级/网络”，点设置，就出现下面的界面，就可以进行代理服务器的设置了，选中“手动配置代理”，然后填写代理服务器的地址和端口。

　　知道了设置方法，下一步就是找到一些免费而且可用的代理服务器地址，通常情况下代理服务器地址不很稳定，经常会改变，对于中国电信用户来说，香港、韩国、日本等代理服务器速度是最快的，对于此次海底光缆中断事件中，香港代理可能同样也无法访问国外，因此建议大家使用韩国的代理服务器。

普通分类:

div+css

Read more about firefox 代理设置

ie6 bug 最低高度

星期五, 2013-10-25 20:33 — shiping1

CSS设置IE6中容器高度BUG

平忠的解决方法:设置overflow:hidden，这是目前看到的最完美的解决方案，如演示12

在IE6中设置display:block的空容器一个较小高度时，如<p style="height:1px;"></p>，会发现其高度不能小于某个值，比如在字体大小为12px时这个值是15px，在浏览器默认字体大小时这个值为19px，如演示1，你可以通过调整IE6中的“查看>字体大小”来观看这个高度的变化。解决方案：

普通分类:

div+css

Read more about ie6 bug 最低高度

marquee 滚动例子

星期六, 2013-10-19 15:17 — shiping1

<marquee width="300" height="95" direction="UP" onmouseover="this.stop();" onmouseout="this.start();" scrollamount="2" loop="-1">
<div class="con02_b">
<ul><li class="ag"></li><li class="bg">卢岳新</li><li class="cg">苏州圣意马服饰有限公司</li><li class="dg">设计师</li></ul>
<ul><li class="ag"></li><li class="bg">吴贵生</li><li class="cg">温州基达服饰有限公司</li><li class="dg">设计师</li></ul>

普通分类:

div+css

Read more about marquee 滚动例子

CSS visibility 属性

星期日, 2013-10-13 00:45 — shiping1

CSS属性中Display与Visibility的不同

2006-03-16 09:05　来源：天极网　作者：龙犊整理　责任编辑：龙犊·yesky　评论(0)

大多数人很容易将CSS属性display和visibility混淆，它们看似没有什么不同，其实它们的差别却是很大的。
visibility 属性用来确定元素是显示还是隐藏，这用visibility="visible|hidden"来表示，visible表示显示，hidden表示隐藏。当visibility被设置为"hidden"的时候，元素虽然被隐藏了，但它仍然占据它原来所在的位置。例：

普通分类:

div+css