liuyt611
- 浏览: 25518 次
- 性别:
- 来自: 北京
-
最新评论
文章列表
首先写一个div，设置宽高，overflow-x；overflow-y：auto，如图：
<div class="s_box">
<p>滚动条测试1</p>
<p>滚动条测试2</p>
<p>滚动条测试3</p>
<p>滚动条测4试</p>
<p> ...
网页中有这样的需求,外层宽度固定了,内层每个li宽度不定,依靠float:left;padding-right:6px;产生间距,没有指定宽度,就导致宽度不可预测,也就是表现为最后一个如果不够显示,字会掉下一行,此情况在ie下表现严重,firefox正常显示.怎么解决呢.
white-space:nowrap;
这样既可. 以后就可以自动换行而不会出现掉下去的尴尬了.
如何使浮动的元素居中
- 博客分类：
- 日常积累
<div class="content">
<div class="left">
<div class="con">这是一个浮动的</div>
</div>
</div>
body{
width:100%;
height:100%;
padding:0px;
overflow:hidden;
}
.content{
width:100%;
height:100%;
}
.left{
...
overflow是一种很好的清除浮动的方法（至少我这么认为），先前发表的《三种有效的清除浮动的方法》里介绍了这种方法，从发表到现在也有一段时间了，这期间在其他地方也看到介绍overflow清除浮动文章，但和《三种有效的清除浮动的方法》里面的不太一样，下面就再说说overflow清除浮动。
以下面的XHTML代码为例：
<div id="container">
<div id="left"></div>
<div id="right"></div>
</div>
...
1、父级div设置高度
<div class="div1">
<div class="left">Left</div>
<div class="right">Right</div>
</div>
<div class="div2">
fshrsjdsjdtg
</div>
<style type="text/css">
.div1{back ...
兼容ie6、7的阴影效果
- 博客分类：
- 日常积累
来源：http://www.zhangxinxu.com/wordpress/2010/04/css%E5%AE%9E%E7%8E%B0%E8%B7%A8%E6%B5%8F%E8%A7%88%E5%99%A8%E5%85%BC%E5%AE%B9%E6%80%A7%E7%9A%84%E7%9B%92%E9%98%B4%E5%BD%B1%E6%95%88%E6%9E%9C/
兼容ie6、7的阴影效果
<style type="text/css">
.box{
position:relative;
width:500px;
height:50 ...
鼠标经过小图，显示大图
- 博客分类：
- 日常积累
<div class="container">
<ul>
<li><a href="b.jpg" class="preview"><img src="b.jpg" width="40" height="40" alt="gallery thumbnail" /></a></li>
<li><a h ...
点击空白处下拉列表隐藏，全选，反选，不选
- 博客分类：
- 工作中遇到的问题
<!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; ...
<script language="javascript">
function myCheckbox(obj,thisobj)
{
var o = document.getElementById(obj);
if(o.checked)
{
thisobj.style.backgroundImage="url(checkOff.JPG)";
o.checked = false;
}
else
{
thisobj.style.backgroundImage="url(checkOn.JPG ...
美化type="file"
- 博客分类：
- 工作中遇到的问题
<div class="fileInput left">
<input type="file" name="upfile" id="upfile" class="upfile" onchange="document.getElementById('upfileResult').innerHTML=this.value"/>
<input class="upFileBtn" type="button& ...
视频播放 ---滚动条的设置
- 博客分类：
- 工作中遇到的问题
此方法需要引入一个插件：jscroll.js.
以下为滚动条样式设置的详细说明：
$(".dd").jscroll({ W:"12px"//设置滚动条宽度
,BgUrl:""//设置滚动条背景图片地址
,Bg:"#ccc"//设置滚动条背景图片position,颜色等
,Bar:{ Pos:"bottom"//设置滚动条初始化位置在底部
,Bd:{Out:"#000",Hover:"red"}//设置滚动滚轴边框颜色 ...
下载--美化select
- 博客分类：
- 工作中遇到的问题
<!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; ch ...
下载--美化select 2
- 博客分类：
- 工作中遇到的问题
<!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; chars ...
需要用到一个selectbox.js插件，在这里直接粘贴到代码里了
还要用到一个叫aa.gif的图片，这里没有传图片，到时候随自己需要加一张图片
<!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>
...
可隐藏固定广告---fix不兼容ie6
- 博客分类：
- 日常积累
<div class="content">
<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
<p>5</p>
<p>6</p>
<p>7</p>
<p>8</p>
<p>9</p>
...