[CSS] 去除a标签超链接的虚线框和高亮效果，禁止浏览器默认input样式

原创于 2015-09-09 18:00:38 发布 · 1.7k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#css

CSS3/HTML 专栏收录该内容

11 篇文章

订阅专栏

本文深入探讨了CSS样式应用、网页布局优化的关键技术，包括元素定位、响应式设计、动画与交互效果，以及如何避免视觉上的锯齿现象。同时，文章详细介绍了旋转屏幕时的字体大小调整策略，确保用户体验的一致性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

a { outline:0; -webkit-tap-highlight-color:rgba(255,0,0,0); -webkit-touch-callout:none; -webkit-user-select:none;}
如果是图片区域，可以加： area { outline:0; -moz-outline:0; blr:expression_r(this.onFocus=this.blur())}

input,textarea { border: 0; -webkit-appearance: none; }

select 下拉选择设置右对齐

select option {
direction: rtl;
}

通过transform进行skew变形，rotate旋转会造成出现锯齿现象

-webkit-transform: rotate(-4deg) skew(10deg) translateZ(0);
transform: rotate(-4deg) skew(10deg) translateZ(0);
outline: 1px solid rgba(255,255,255,0)

旋转屏幕时，字体大小调整的问题
html, body, form, fieldset, p, div, h1, h2, h3, h4, h5, h6 {
-webkit-text-size-adjust:100%;
}

动画定义3D启用硬件加速
{
-webkit-transform:translate3d(0, 0, 0)
transform: translate3d(0, 0, 0);
}