css 文字超出省略号
# 单行省略号
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden# 多行省略号
display: -webkit-box;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hiddencss3 flex 左右布局
display: flex;
justify-content: space-betweencss 强制换行 强制不换行
/* 强制不换行 */
div {
white-space: nowrap;
}
/* 强制换行 */
div {
word-wrap: break-word;
word-break: normal;
}
/* 强制英文断行 */
div{
word-break:break-all;
}
/* 强制中文断行 */
div {
white-space: pre-wrap
}php json_encode 中文不转码
# json_encode() 第二个参数：JSON_UNESCAPED_UNICODE 实现中文不转码
json_encode(['name' => '中文'], JSON_UNESCAPED_UNICODE);Mysql 自动增长ID 清零 的几种方法
清空表数据 并且 自动增长ID清零
TRUNCATE TABLE 表名;存在数据 设置或重置 自动增长ID
ALTER TABLE 表名 AUTO_INCREMENT = 0;jquery 简单实现tab切换效果
jQuery 下载地址 https://jquery.com/download/
<!-- Html 代码 -->
<div class="tabs-block">
<ul class="tab-tiem">
<li class="active">选项一</li>
<li>选项二</li>
<li>选项三</li>
</ul>
<div class="tab-content">
<div class="active">页面一</div>
<div>页面二</div>
<div>页面三</div>
</div>
</div>// jQuery 代码
$(function() {
$('.tab-item').on('click', 'a', function() {
$(this).addClass('active').siblings().removeClass('active');
$('.tab-content > div').eq($(this).index()).addClass('active').siblings().removeClass('active');
})
})css/css3 常用垂直居中和水平居中的方法
ps：未考虑兼容问题
/* 第一种*/
.box {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
/* 第二种*/
.box {
text-align: center;
vertical-align: middle;
}
/* 第三种 */
.box {
display: flex;
justify-content: center;
align-items: center
}