这一难题很奇怪,话很少少立即上编码:
.g-dialog-wrapper {
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
display: flex;
flex-direction: column;
width: 405px;
background-color: #ffffff;
height: 226px;
-webkit-box-shadow: 0 0 2em #5191f1;
-moz-box-shadow: 0 0 2em #5191f1;
box-shadow: 0 0 2em #5191f1;
border-radius: 3px;
z-index: 9999;
}
上边这css款式,得到的网页页面竟然字体样式那麼模糊不清:
网上查了一下,仿佛是说和访问器3D渲染不太好,transform里的值不可以设定成数量,但我这儿摆明也不是数量:
transform: translate(-50%, -50%);
之后我改动了一下,把width和height改为偶数便可以了。
width: 404px;
height: 226px;
到此这篇有关详细说明css3应用transform出現字体样式模糊不清的处理方法的文章内容就详细介绍到这了,大量有关css3 transform字体样式模糊不清內容请检索脚本制作之家之前的文章内容或再次访问下边的有关文章内容,期待大伙儿之后多多的适用脚本制作之家!