css
关注
分享
扫一扫
蕃薯耀
这个作者很懒，什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
不设置DIV宽度水平居中，div不设置宽度居中
不设置DIV宽度水平居中，div不设置宽度居中 ================================ ©Copyright 蕃薯耀 2021-07-22 https://www.cnblogs.com/fanshuyao/ 方式一：使用浮动 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title>水平居中&l原创 2021-07-22 16:57:27 · 371 阅读 · 0 评论 -
Css实现透明效果，兼容IE8
;> 蕃薯耀 2015年9月9日 17:39:24 星期三 http://fanshuyao.iteye.com/ /* background: rgba(0, 0, 0, 0.2) none repeat scroll 0 0 !important; */ background-color:#000; opacity:0.3; filter:alpha(opacity=30); IE8显示效果： 谷歌内核浏览器显示效果： 下面为较2015-09-09 17:44:45 · 333 阅读 · 0 评论 -
list-style无颜色问题解决，list-style-type无颜色解决
>>>>> 蕃薯耀 2015年9月11日 10:15:07 星期五 http://fanshuyao.iteye.com/ 如下图所示：在Css文件中为li添加样式 list-style-type: decimal; 但右边的链接有hover的颜色，而数字没有颜色，显得别扭。 解决方法： 解决方法一：给li加上相同的颜色，但不好的是如果a链接本身的颜色和a链接hover时的颜色不一样，又会造成两者在hover时2015-09-11 10:26:01 · 375 阅读 · 0 评论 -
各大浏览器CSS Hack收集
2015-09-12 10:13:34 · 122 阅读 · 0 评论 -
td中使用overflow:hidden; 无效解决方案
t;>>> 蕃薯耀 2015年11月17日 17:15:10 星期二 http://fanshuyao.iteye.com/ 解决方法： .dot{ overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } 在td内加一层<td><div class='w400 dot'>内容&2015-11-17 17:21:17 · 608 阅读 · 0 评论 -
float浮动之后高度自适应失效解决方案
2015-11-17 17:36:06 · 489 阅读 · 0 评论 -
让IE支持Css3属性（圆角、阴影、渐变）
2015-11-20 10:59:00 · 142 阅读 · 0 评论 -
table完美css样式，table的基本样式，table样式
;>>> 蕃薯耀 2016年6月15日 09:04:26 星期三 http://fanshuyao.iteye.com/ 一、table的css样式 边框线不会重复叠加，不会有些粗有些细，全部统一。 /*table start*/ table.default-table{ /* -moz-border-radius: 5px; -webkit-border-radius:5px; border-radius:5px; */ w2016-06-15 09:08:38 · 1228 阅读 · 0 评论 -
favicon.ico显示，favicon显示，favicon图标显示
蕃薯耀 2016年7月19日 17:39:33 星期二 http://fanshuyao.iteye.com/ 一、favicon图标显示 1、把favicon.ico图标文件放在项目的根目录下，命名必须是：favicon.ico 。 2、在<head></head>标签中加入下面的代码： <link rel="shortcut icon" type="image/ico2016-07-19 17:56:19 · 713 阅读 · 0 评论 -
html响应式布局，css响应式布局，响应式布局入门
> 蕃薯耀 2016年7月25日 15:31:51 星期一 http://fanshuyao.iteye.com/ 一、效果如下： 1、当屏幕宽度大于或等于960px时，显示为： 2、当屏幕宽度小于960px且大于640px时，显示为： 3、当屏幕宽度小于640px时，显示为： 二、代码： 1、Html页面代码： 需要注意的是引入的link： 里面使用了Media属性： media="screen and (min-wid2016-07-25 15:43:49 · 221 阅读 · 0 评论 -
菱形实现气泡Bubble，菱形画箭头，菱形画三角形
蕃薯耀 2016年7月27日 16:32:44 星期三 http://fanshuyao.iteye.com/ 一、菱形实现气泡Bubble，效果如下： 二、实现原理： 1、使用2个◆覆盖叠加实现。 2、页面代码： <div class="mt15"> <div class="bold">菱形实现气泡Bubble</div> &2016-07-27 16:37:43 · 188 阅读 · 0 评论 -
laydate兼容bootstrap
33:43 星期二 http://fanshuyao.iteye.com/ 在使用Bootstrap后，再使用laydate，框会偏移一点，原因是Bootstrap使用了 * {box-sizing:border-box;} 来reset浏览器的默认盒子模型。所以加上以下样式就能兼容Bootstrap了 .laydate_box, .laydate_box * { box-sizing:content-box; } 另外，由于input的样式不一样，导致输2015-09-08 10:38:52 · 159 阅读 · 0 评论 -
去除inline-block元素间间距的N种方法
;>>>>>> 蕃薯耀 2014年7月29日 16:38:50 星期二 方法一：移除空格 元素间留白间距出现的原因就是标签段之间的空格，因此，去掉HTML中的空格，自然间距就木有了。考虑到代码可读性，显然连成一行的写法是不可取的，我们可以： <div class="space"> <a href="##">2014-07-29 16:45:43 · 110 阅读 · 0 评论 -
HTML之Position用法
t;sub1</id> <div id="sub2">sub2</id></div>1. relativerelative属性相对比较简单，我们要搞清它是相对哪个对象来进行偏移的。答案是它本身的位置。在上面的代码中，sub1和sub2是同级关系，如果设定sub1一个relative属性，比如设置如下CSS代码：#sub1{ position: relative;2013-04-19 14:43:05 · 117 阅读 · 0 评论 -
span右浮动折行,解决ie6/ie7/ie8中span右浮动折行问题
>>> 蕃薯耀 2013年10月30日 16:14:34 星期三2013-10-30 16:14:53 · 144 阅读 · 0 评论 -
js获取字符串的实际长度
2013-10-31 14:33:48 · 148 阅读 · 0 评论 -
带图标的input输入框
2014-05-26 09:14:24 · 562 阅读 · 0 评论 -
100%全屏菜单导航，兼容IE6
>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>2014-05-26 09:19:03 · 158 阅读 · 0 评论 -
CSS实现文本溢出自动截断
>>>>>>> 蕃薯耀 2014年7月10日 17:09:43 星期四 主要代码有三个属性组成，缺一不可： overflow: hidden; white-space: nowrap; text-overflow: ellipsis; 注意：IE6必须指定宽度。 >>>>>>&g2014-07-10 17:10:44 · 246 阅读 · 0 评论 -
兼容IE6的遮罩层
7月10日 18:06:35 星期四 兼容IE6的遮罩层，利用“* Html”这个Hack，设置IE6使用position:absolute;和 expression 来模拟fixed的效果，另外设置background:url(*)防止抖动。 遮罩层Css代码： .overlay{ position: fixed; z-index: 100000; /*按需设置*/ width: 100%; height: 100%; top: 0;2014-07-10 18:11:44 · 246 阅读 · 0 评论 -
div相对屏幕居中
原理很简单,主要记住以下3点： 第一点要求:position:absolute 第二点要求:left:50%;top:50% 第三点要求:margin-left:-175px [也就是-(350/2)] margin-top:-150px [也就是-(300/2)] 原理： 先让这个DIV绝对定位; 让他距离上边50%,左边50%;这会这个DIV的左上角这个点就是窗口的正中间; 因为已经知道了这个DIV的高和宽了,那么再从这里点向左移动总宽及高的一半就可以了. 举例：2014-07-21 10:23:51 · 282 阅读 · 0 评论 -
A链接点击后a:hover的CSS样式不起作用的问题原因与解决办法
t;> 蕃薯耀 2014年7月24日 16:55:32 星期四爱恨原则（LoVe HAte） a:link{ font-size:12px; color:#000; text-decoration:none; } a:visited{ font-size:12px; color:#000; } a:hover{ color:red; text-decoration:underline;2014-07-24 17:05:26 · 762 阅读 · 0 评论 -
去除点击链接后的虚线框，去除A链接产生虚线的方法
t;> 蕃薯耀 2014年7月29日 12:27:58 星期二 IE中A链接点击会产生虚线框，在Css文件加入如入代码即可去除（兼容IE和火狐浏览器）： a {outline: none;} a:active {star:expression(this.onFocus=this.blur());} :focus { outline:0; } >>>>>>&2014-07-29 12:32:47 · 131 阅读 · 0 评论 -
CSS3 图形
2013-02-01 11:32:48 · 95 阅读 · 0 评论