相关疑难解决方法(0)

CSS翻译后可以"捕捉到像素"吗?

我创建了一个模态框,并使用Chris Coyer提到技术垂直居中.到目前为止,我发现它唯一的问题是有时候盒子会偏移半个像素,这可能会让一些孩子看起来有点不稳定.我的问题是:是否可以将结果捕捉到最近的整个像素?

更新

这里有几张照片可以更好地说明问题.在第一张图像中,您可以看到文本输入和链接下划线已正确呈现:

莫代尔盒子,线条清晰

第二张图显示了使用CSS变换后的效果.请注意链接下划线的模糊和错误呈现的文本输入.

在此输入图像描述

虽然第二张图像没有显示,但有时我会注意到顶部和底部的白线具有相同的模糊效果.

对于记录,文本输入使用简单边框和背景颜色进行样式设置.我在这里包含了这些输入的CSS,所以你可以看到没有什么特别的事情发生:

input {
    background-color: #FFFFFF;
    border: 1px solid #CCCCCC;
    border-radius: 0;
    box-shadow: 0 1px 3px -1px #D5D5D5 inset;
    color: #4C4C4C;
    display: inline-block;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 12px;
    max-width: 100%;
    padding: 5px;
    transition: border-color 0.1s ease 0s;
}
Run Code Online (Sandbox Code Playgroud)

css transform

31
推荐指数
2
解决办法
1万
查看次数

标签 统计

css ×1

transform ×1