一. CSS小tip
- Chrome在设置font-size时,小于12px的都将无效,使用transform:scale(0.8);来缩小(缺点是整个容器也将缩小)。
- 使用CSS截断文字方法:
- display: inline-block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;
- 居中大法:
- left:50%; top:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); position: absolute;
- border-radius:可以赋8个值,
斜线前面的影响的是水平方向,斜线后面影响的是垂直方向,各个数字就分别代表四个不一样的方向。
如:border-radius: 5px 5px 3px 2px / 5px 5px 1px 3px;
- outlinet:将input输入框去掉默认的蓝线框的方法
outline-offset:outline的距离
- empty-cells:table中,你可以使用empty-cells属性来指定相应的样式
table { empty-cells: hide; }
- clip:定义一个剪裁矩形。对于一个绝对定义元素,在这个矩形内的内容才可见
clip: rect(110px, 160px, 170px, 60px);
::first-letter:第一个字母就会被修饰到
.text::first-letter { color: blue; background: yellow; }
- 实现左边div固定宽度,右边div自适应撑满剩下的宽度
- .container { display: flex }
- .left { flex: none; width: whatever }
- .right { flex: 1 }
二. JQ小tip
- 使用 ‘use strict’;将javascript设定为严格模式。
- 使用for...in...时,要判断是否为拥有属性,否则会报警告
if (person.hasOwnProperty(p)) {
if (typeof LoadingEnd === "function") {
LoadingEnd();
}
jQuery.support.cors = true;
$.ajax({
type: "POST",
url: url_post,
crossDomain: true,
success: function (result) {}
}
});
- eval(..)函数会将其中的内容视为程序中的代码,通常用于执行动态代码,如:
eval(“var a = 2”);
console.log(a);//输出2
var Myfunction = {
something: " mything ",
doSometing: function( ) {
// …...
}
}
- 匿名函数(表达式)就是函数表达式,函数表达式可以省略函数名,如
(function foo(){
//…...
})();//这样这个函数表达式将自动运行,并且形成一个独立的作用域
- let关键字,可以讲变量绑定到所在的作用于中,上层作用域将不能使用该变量。
function dosomething(){
let a = 10;
}
console.log(a);//访问错误
- const关键字定义常量,和let用法相同,不过变量一旦赋值将不能修改
- 动态加载样式表css
function loadCss( url ){
var link = document.createElement( "link" );
link.type = "text/css";
link.rel = "stylesheet";
link.href = url;
document.getElementsByTagName( "head" )[0].appendChild( link );
};