css:文本框上的白色背景边框来自哪里?

发布于 2024-10-04 15:51:45 字数 890 浏览 0 评论 0原文

我有以下页面:

http://www.jameschang.com/faxlogic/

其中文本框有这些白色边框位于右上角登录部分的 4 个角上。

我对这些文本框有以下 css 属性:有

.HeaderLoginField {
    background-image: url(../content/login_field.png);
    float: left;
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    font-size: 12px;
    color: #969696;
    border-top-width: 0px;
    border-right-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 0px;
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    height: 25px;
    width: 160px;
    text-indent: 3px;
    background-color: #0F0F0F;
    background-repeat: no-repeat;
    font-weight: normal;
}

什么想法为什么会发生这种情况吗?我已将 png 图像更改为 gif,但它们消失了,但我想使用 png。有什么想法为什么会发生这种情况吗?

提前致谢

I have the following page:

http://www.jameschang.com/faxlogic/

where the textboxes have these white borders on on their 4 corners in the upper right login section.

I have the following css attributes for those textboxes:

.HeaderLoginField {
    background-image: url(../content/login_field.png);
    float: left;
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    font-size: 12px;
    color: #969696;
    border-top-width: 0px;
    border-right-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 0px;
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    height: 25px;
    width: 160px;
    text-indent: 3px;
    background-color: #0F0F0F;
    background-repeat: no-repeat;
    font-weight: normal;
}

any ideas why this might be happening? I have changed the png images to a gif and they go away however i want to use png. Any ideas why this is happening?

thanks in advance

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(5

一江春梦 2024-10-11 15:51:45

它绝对是您正在使用的图像,我使用 firebug 检查了该元素,当禁用/启用背景图像时,白色角消失了!

Its definitely the image you're using, i inspected the element using firebug and when disabled/enabled the background image, the white corners went away!

梦在深巷 2024-10-11 15:51:45

它的背景图像,
你可以制作一个新图像,
或者使用 css 获得您想要的外观。

its the background image,
you can make a new image,
or get the look you want using css.

太阳哥哥 2024-10-11 15:51:45

它是图形:url("../content/login_field.png"),它似乎对白色背景而不是黑色背景进行了抗锯齿处理。 png 可以使用透明度来代替背景而工作。

It's the graphics: url("../content/login_field.png") which seems to be anti aliased to a white background instead of black. The png could use transparency instead to work regardless of background.

你好,陌生人 2024-10-11 15:51:45

您是否忘记打开 PNG 文件的透明度?

Did you forget to turn on transparency for your PNG file?

猫九 2024-10-11 15:51:45

如果您想使用 8 位(索引)PNG 而不是 24 位 PNG,则使用黑色作为遮罩(遮罩是透明图像边缘将混合的颜色)而不是白色,但最好使用带有 alpha 的 24 位 PNG透明度,这样它就可以在任何背景下工作。

If you want to use 8bit (indexed) PNG instead of 24bit PNG, then use black as matte (the matte is the color against which the edges of the transparent image will blend) instead of white, but it's better to use 24bit PNG with alpha transparency, this way it will work on any background.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文