XHTML/CSS – 小泥巴的博客

ueditor上传慢

chrome52.0.2743.80以上，

accept: {
  title: \'Images\',
  extensions: \'jpg,jpeg,png\',
  mimeTypes: \'image/*\'
}

1

2

3

4

5

accept: {

title: \'Images\',

extensions: \'jpg,jpeg,png\',

mimeTypes: \'image/*\'

}

改为

accept: {
  title: \'Images\',
  extensions: \'jpg,jpeg,png\',
  mimeTypes: \'image/jpg,image/jpeg,image/png\'   //修改这行
}

1

2

3

4

5

accept: {

title: \'Images\',

extensions: \'jpg,jpeg,png\',

mimeTypes: \'image/jpg,image/jpeg,image/png\' //修改这行

}

同样的，由于UEditor与WebUploader是同一个团队开发出来的，它们的代码也是共用的，于是，同样的问题会出现在UEditor中，解决方法也是一样的，打开文件：ueditor.all.min.js （或者ueditor.all.js）通过 “accept” 或者”imag… 继续阅读 ueditor上传慢

移动端页面使用rem来做适配

rem介绍 rem（font size of the root element）是指相对于根元素（即html元素）的字体大小的单位。假设根元素的字体大小是10px, 则5rem的大小为 5*10=50px,例如

html{
    font-size: 10px;
}
p{
    width: 2rem; /* 2*10 = 20px;*/
    margin: 1rem;
}

1

2

3

4

5

6

7

html{

font-size: 10px;

}

p{

width: 2rem; /* 2*10 = 20px;*/

margin: 1rem;

}

rem来做适配以前我们往往这样做页面：viewport width 设置为 device-width，然后选我们需要兼容设备的最小宽度（一般是320px）。根据这最小宽度来做页面。单位使用px和百分比。在宽度不同的设备… 继续阅读移动端页面使用rem来做适配

以前给大家介绍过13个不错的Javascript和CSS的菜单、20个优秀的Javascript导航技术、30种时尚的CSS网站导航条，今天在网上看到一篇文章其收集了30多个下拉菜单（分为两类，jQuery和CSS+Javascript的），转过来。原文：http://smashinghub.com/3-useful-drop-down-menu-scripts-to-enhance-header-navigation.htm jQuery Smooth Navigation Menu Sim… 继续阅读 30+ Web下拉菜单

弹出层easyDialog

弹出层在项目中使用得比较多，但是以前使用的要么是有烦人的BUG，要么是使用起来不是很方便，索性自己写了这么一个简单、实用的弹出层–easyDialog。 easyDialog没有模板机制，只负责逻辑层的弹出效果，至于内容(消息框、表单、图片等)该如何呈现，easyDialog都不管，内容属于业务层的东西，业务需求是千变万化的，如果逻辑和业务结合很紧密，那么可移植性和可扩展性将大大降低。当然，如果你想找那种集成了模板的弹出层，请移步artDialog，artDialog的模板设计得很精… 继续阅读弹出层easyDialog

清除浮动两法（sofish)

清理浮动有很多种方式，像使用 br 标签自带的 clear 属，使用元素的 overflow，使用空标签来设置 clear:both 等等。但考虑到兼容问题和语义化的问题，一般我们都会使用如下代码来清理浮动。

/* 清理浮动 */
.clearfix:after {
	visibility:hidden;
	display:block;
	font-size:0;
	content:&quot; &quot;;
	clear:both;
	height:0;
}
.clearfix {
	zoom:1;
}

1

2

3

4

5

6

7

8

9

10

11

12

/* 清理浮动 */

.clearfix:after {

visibility:hidden;

display:block;

font-size:0;

content:" ";

clear:both;

height:0;

}

.clearfix {

zoom:1;

}

其原理是，在「高级」浏览器中使用 :after 伪类在浮动块后面加上一个非 display:none 的不可见块状内容来，并给它设置 clear:both 来清理浮动。在 ie6 和 7 中给浮动… 继续阅读清除浮动两法（sofish)

background写法（css复合属性写法)

1. 背景－background ========================================================== 单个属性的写法 .sample1 { background-color: #CCCCCC; /*背景颜色*/ background-image: url(sample.gif); /*背景图片*/ background-repeat: no-repeat; /*平铺(?)*/ background-attachment: fixed; /*随文本… 继续阅读 background写法（css复合属性写法)

jQuery png透明插件解决ie6下png透明问题

一个可以使IE6及以下版本支持透明PNG图像的Jquery插件，使用起来很方便，支持透明PNG图像及背景，支持连缀，不会改动页面的任何html标签，可复原（偶尝试了下不成功哈，查看Jquery官网发现该方法被作者移除了）。原作者文档：http://jquery.khurshid.com/ifixpng.php Jquery官网文档：http://plugins.jquery.com/project/iFixPng2 本人demo一枚：http://blog.cargoo.net/… 继续阅读 jQuery png透明插件解决ie6下png透明问题

简单针对IE6,7,8的CSS hack

刚好看到有这么一篇文章，翻译过来给需要的人看看，同时也给自己看看。


body{
         color:red; //所有浏览器
         color:yellow9; //IE8及以下
         *color:blue; //IE7及以下
         _color:gray; //IE6
}

1

2

3

4

5

6

7

8

body{

color:red; //所有浏览器

color:yellow9; //IE8及以下

*color:blue; //IE7及以下

_color:gray; //IE6

}

值得注意的是9是针对IE8及以下版本（未测试是否包含IE6以下版本),而如果是color:orange/0;把9换成0就是只针对IE8的hack了。同时还要注意，条件注释(conditional comments)是一种更好的hack方式。


&lt;!--[if IE 6]&gt;
      body{
              color:green; //IE6
      }
&lt;![endif]--&gt;

1

2

3

4

5

6

7

<!--[if IE 6]>

body{

color:green; //IE6

}

<![endif]-->

本文翻译自http://net.tutsplus.com… 继续阅读简单针对IE6,7,8的CSS hack

常用css缩写

使用缩写可以帮助减少你CSS文件的大小，更加容易阅读。css缩写的主要规则如下：颜色 16进制的色彩值，如果每两位的值相同，可以缩写一半，例如： #000000可以缩写为#000;#336699可以缩写为#369; 盒尺寸通常有下面四种书写方法: property:value1; 表示所有边都是一个值value1； property:value1 value2; 表示top和bottom的值是value1,right和left的值是value2 property:value1 value2 … 继续阅读常用css缩写

打败 IE 的葵花宝典：CSS Bug Table

原文发表于：Alipay UED Blog – 打败 IE 的葵花宝典：CSS Bug Table 作为一名前端，我们通常要做的就是让页面在各系统A-Grade浏览器，甚至网站浏览份额0.1%以上的浏览器上良好显示。当然，还有性能问题。不过，今天要说的是样式的兼容问题。在IE/Mozilla/Webkit/Opera四分天下的今天，IE6-9/Mozilla（Gecko）系列 /Chrome/Safari/Opera etc. 这些浏览器的兼容，无不让前端们头痛。而在这之中，最让人头痛的当数I… 继续阅读打败 IE 的葵花宝典：CSS Bug Table

一个css定义列表的例子

下载：课程分类代码 <!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 htt… 继续阅读一个css定义列表的例子

ff/ie6、7、8css兼容写法

浏览器市场的混乱，给设计师造成很大的麻烦，设计的页面兼容完这个浏览器还得兼容那个浏览器，本来ie6跟ff之间的兼容是很容易解决的。加上个ie7会麻烦点，ie8的出现就更头疼了，原来hack ie7的方法又不能用了，怎么办呢？第一种方法：还好，微软提供了这样一个代码： <meta http-equiv="x-ua-compatible" content="ie=7" /> 把这段代码放到<head>里面，在ie8里面的页面解析起来… 继续阅读 ff/ie6、7、8css兼容写法

一	二	三	四	五	六	日
« 6月
1	2	3	4	5	6	7
8	9	10	11	12	13	14
15	16	17	18	19	20	21
22	23	24	25	26	27	28
29	30	31