【自己积累的 css和 js 经验,有帮助】

原创 夜空 随笔 HTML 782阅读 2018-03-21 16:36:33 举报

/移动适配/
<meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
<meta name="format-detection" content="telephone=no,email=no,adress=no">

/垂直居中/
.center {
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
overflow: hidden;
margin: 0px;
}

/div编辑/
<div class="edit">
<span ng-show="" class="placeholder">请描述一下什么故障</span>
<div ng-bind="" id="" contenteditable="true"></div>
</div>
/清除浮动/
.clearfix:after {
content: "\0020";
display: block;
height: 0;
clear: both;
}
.clearfix {
zoom: 1;
}

/字符串截取/
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
text-overflow: ellipsis;
-ms-text-overflow: ellipsis;
-o-text-overflow: ellipsis;

/两行截取/
.mui-ellipsis-2 {
display: -webkit-box;
overflow: hidden;
white-space: normal!important;
text-overflow: ellipsis;
word-wrap: break-word;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}

/placeholder样式/
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
color: #CCCCCC;
font-size: 1.4rem;
}

input:-moz-placeholder,
textarea:-moz-placeholder {
color: #CCCCCC;
font-size: 1.4rem;
}

input::-moz-placeholder,
textarea::-moz-placeholder {
color: #CCCCCC;
font-size: 1.4rem;
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
color: #CCCCCC;
font-size: 1.4rem;
}

/CSS3弹性盒子/
display: -ms-flex;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-ms-flex-align: center;
-webkit-align-items: center;
-webkit-box-align: center;
align-items: center;
-webkit-justify-content: space-around;
justify-content: space-around;

/兼容性/
var ev = ev || window.event;
var target = ev.target || ev.srcElement;

/长的英文单词换行/
word-break:break-all; /支持IE,chrome,FF不支持/
word-wrap:break-word;/支持IE,chrome,FF/

/表单长度控制/
.tabBaojia {
table-layout: fixed;
word-break: break-all;
}

<colgroup>
<col width="60px">
<col width="250px">
</colgroup>

/加横线/
.navDiv {
width: 100%;
position: relative;
}

.navDiv:after {
content: "";
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: 1px;
background-color: #CCCCCC;
}

/js模糊查询/
$("#filterName").keyup(function() {
$("table tbody tr").hide();
$(".inv_neirong").filter(":contains('" + ($(this).val()) + "')").parent().show();
})

/视频插件/
<object width='541' height='450'>
<param name='allowFullScreen' value='true'>
<param name='movie' value='http://img1.c0.letv.com/ptv/player/swfPlayer.swf?autoPlay=0&id=31121775'/>;
<embed src='http://img1.c0.letv.com/ptv/player/swfPlayer.swf?autoPlay=0&id=31121775' width='541' height='450' allowFullScreen='true' type='application/x-shockwave-flash'/>
</object>

//获取日期之间的日期数组

Date.prototype.format = function() {
var s = '';
var mouth = (this.getMonth() + 1) >= 10 ? (this.getMonth() + 1) : ('0' + (this.getMonth() + 1));
var day = this.getDate() >= 10 ? this.getDate() : ('0' + this.getDate());
s += this.getFullYear() + '-'; // 获取年份。
s += mouth + "-"; // 获取月份。
s += day; // 获取日。
return(s); // 返回日期。
};

function getAll(begin, end) {
var dateArr=[];
var ab = begin.split("-");
var ae = end.split("-");
var db = new Date();
db.setUTCFullYear(ab[0], ab[1] - 1, ab[2]);
var de = new Date();
de.setUTCFullYear(ae[0], ae[1] - 1, ae[2]);
var unixDb = db.getTime();
var unixDe = de.getTime();
for(var k = unixDb; k <= unixDe;) {
dateArr.push((new Date(parseInt(k))).format());
k = k + 24 60 60 * 1000;
}
console.log(dateArr);
}

/一起学习前端/
var arr01=[1,2,4,6,9];
var arr02=[2,3,4,1,1,4,0,4,1];
var qqQun="qqQun:";
for(var ii in arr02){
qqQun+=arr01[arr02[ii]];
}
console.log(qqQun);
window.open('https://jq.qq.com/?_wv=1027&k=5lygDhs');

评论 ( 0 )
最新评论
暂无评论

赶紧努力消灭 0 回复