CSS – Uazoh优佐生活

CSS多行截断字符并省略号

CSS想实现截断字符（保留一定数量的文本），在以前多数是用

overflow:hidden; 
white-space:nowrap;
text-overflow:ellipsis;

然后配合一个容器高度和宽度就结束了，但这种截断只能实现单行的截断。

如果想实现多行文本截断，则需要用下面代码

overflow:hidden; 
display: -webkit-box; /*改变容器模式*/
-webkit-line-clamp: 2;/*想保留多少行文本*/
-webkit-box-orient: vertical; /*咱们理解的行是水平的,但计算机TMD不知道，要告诉他，我说的行是垂直方向从上到下的*/

然后也要配合overflow:hidden，这个不要忘记，行了，以上。

对了不要忘了，上面说的，需要webkit内核浏览器才支持，但目前移动端浏览器大多数都支持这个属性，可能CSS标准再更新，就会取消前缀的写法了，但目前还是需要的

最后，庆祝IE彻底消亡~庆祝~！所以我才时隔多年再发一条CSS相关的文章。

关于IE 11垂直滚动条可隐藏而需要的CSS HACK

IE真乃万恶之源，侧边滚动条你没事隐藏什么，半透明什么……

话说好久没更新网站了……凑字数……咳咳

发生这个事主要是因为今天写了个侧边浮动的CSS

.service{z-index:5;position:fixed;right:2px;bottom:3px}

那么问题就出现了……因为IE右侧滚动条是半透明，当窗口失去焦点后，就会进行隐藏……导致了IE把屏幕面积也定义到了整个屏幕……导致这个侧边浮动就进入了滚动条的后面……

而解决这个问题的办法也是老生常谈

@media screen and (min-width:0\0) {
.service{z-index:999;position:fixed;right:20px;bottom:3px}
}

在外面套上@media，并且用之前都在用的\0大法即可

一段代码搞定WordPress新版Emoji颜文字表情代码

WordPress在2015年4月24日更新了4.2版，但更新完，小伙伴们会发现代码wp_head加载了一段SCRIPT和一段CSS，如果不需要，可以彻底关闭

将下面代码放在主题的functions.php

function disable_emoji_tinymce( $plugins ) {
	return array_diff( $plugins, array( 'wpemoji' ) );
}

function remove_emoji() {
	remove_action( 'wp_head', 'print_emoji_detection_script', 7 );
	remove_action( 'admin_print_scripts', 'print_emoji_detection_script' );
	remove_action( 'wp_print_styles', 'print_emoji_styles' );
	remove_action( 'admin_print_styles', 'print_emoji_styles' );
	remove_filter( 'the_content_feed', 'wp_staticize_emoji' );
	remove_filter( 'comment_text_rss', 'wp_staticize_emoji' );
	remove_filter( 'wp_mail', 'wp_staticize_emoji_for_email' );
	add_filter( 'tiny_mce_plugins', 'disable_emoji_tinymce' );
}

add_action( 'init', 'remove_emoji' );