1. 文本超长显示省略号及safari显示自带tooltip修复办法
参照以下链接:Prevent Safari from showing tooltip when text overflow is hidden with ellipsis
CSS写法:
.text-inline {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.text-inline::before {
content: '';
display: block;
}
.text-inline::after {
content: '';
display: block;
}
LESS和SASS写法:
.text-inline {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
&:before {
content: '';
display: block;
}
&:after {
content: '';
display: block;
}
}
2. 屏蔽/禁止用户双击选择文本
参照以下链接:Disable double click select
.noselect {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
3. 导航栏在选中后出现蓝色虚边框
这是由于默认当元素获得焦点后会有一个outline
,使用一下全局css可以解决该问题。
:focus {
outline-style: none;
}