CSS背景Firefox? [英] CSS Background Firefox?

查看:50
本文介绍了CSS背景Firefox?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

请耐心等待我,因为我不熟悉Firefox和CSS。我已经通过一些团体浏览了

来寻找与我自己类似的问题,但

无法找到明确的答案。如果有人在这里可以帮助我,我会非常感谢你的共享专业知识。


我的背景图片在IE中显示得很好,有时在Firefox中

,直到我点击重新加载按钮。似乎浏览器无法找到图像并从我的webhost中抛出一个图形关于

远程

图像托管。它不是远程托管的图像,它就在

我的图像文件夹和CSS文件中。


如果有人可以看看并指出CSS文件

下面的任何明显错误,并且网址是 http://www.arteccentrix.5u.com/index3.html

提前致谢

Maurice Snell


/ * CSS文件* /


* {

身体:0;

填充:0;

保证金:0;


}


身体{

background:url( http://www.arteccentrix.5u.com/images/bgstripes.gif);

font-family:Verdana,Arial,Helvetica,sans-serif ;

字体大小:9px;

margin-top:75px;

text-align:center;

颜色:#777777;


}


#wrapper {

职位:亲戚;

margin-left:auto;

margin-right:auto;

padding-top:100px;

宽度:800px;

身高:600px;

背景颜色:#FFFFFF;

border:2px solid#CE3095;


}


#rgheader {

text-align:right;

宽度:50%;

位置:绝对;

右:15px;

顶部:-19pt;


}


#rgheader h1 {

font-weight:打印机;

字体大小:24px;


}


#rglinks {

职位:绝对;

填充:10px;

顶部:0;

剩余:0;


}


#rglinks ul {

display:inline;

list-style:none;

margin:0px;
< br $>
}


#rglinks li {

font-weight:bold;

display:inline;


}


#rglinks a {

颜色:#777777;

text-decoration:none;

margin-right:10px;

border-top:3px solid#CE3095;


}


#rglinks a:悬停{

border-top:3px solid#F4C0DA;


}


#content {

宽度:自动;

身高:500px;


}


#content h1 {

text-align:right;

margin-right:20px;

margin-left:200px;

font-size:16pt;

border-bottom:2px solid#F4C0DA;


}


#content p {

text-align:right;

margin:10px 20px 30px 200px;


}


#picturelist {

text-align:right;

l ist-style-type:none;

margin-right:15px;

margin-left:30px;


}


#picturelist li {

float:right;

margin-right:20px;

margin -bottom:10px;

font-weight:bold;

颜色:#777777;


}


#picturelist img {

display:block;

border:1px solid#CE3095;


}


#picturelist img:hover {

border:1px solid#F4C0DA;


}


#picturelist a {

颜色:#777777;

text-decoration:none;


}


#picturelist a:悬停{

颜色:#999999;

Please bear with me as I am new to both Firefox and CSS. I have browsed
through a number of groups looking for similar problems to my own but
can''t find a definitive answer. If anyone here can help me out I would
appreciate your shared expertise so much.

My background image is displaying fine in IE, and, sometimes in Firefox
until I hit the reload button. It seems as if the browser is unable to
locate the image and throws up a graphic from my webhost regarding
remote
image hosting. It is not a remotely hosted image, it''s right there in
my images folder along with the CSS file.

If anyone can take a look and point out any glaring errors the CSS file
is below, and the url is http://www.arteccentrix.5u.com/index3.html

Thanks in advance
Maurice Snell

/* CSS Document */

*{
body:0;
padding:0;
margin:0;

}

body{
background:url(http://www.arteccentrix.5u.com/images/bgstripes.gif);
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:9px;
margin-top:75px;
text-align:center;
color: #777777;

}

#wrapper{
position:relative;
margin-left: auto;
margin-right: auto;
padding-top:100px;
width:800px;
height:600px;
background-color:#FFFFFF;
border: 2px solid #CE3095;

}

#rgheader{
text-align:right;
width:50%;
position:absolute;
right:15px;
top:-19pt;

}

#rgheader h1{
font-weight:lighter;
font-size:24px;

}

#rglinks{
position:absolute;
padding:10px;
top:0;
left:0;

}

#rglinks ul{
display:inline;
list-style:none;
margin:0px;

}

#rglinks li{
font-weight:bold;
display:inline;

}

#rglinks a{
color:#777777;
text-decoration:none;
margin-right:10px;
border-top:3px solid #CE3095;

}

#rglinks a:hover{
border-top:3px solid #F4C0DA;

}

#content{
width:auto;
height:500px;

}

#content h1{
text-align:right;
margin-right:20px;
margin-left:200px;
font-size:16pt;
border-bottom: 2px solid #F4C0DA;

}

#content p{
text-align:right;
margin:10px 20px 30px 200px;

}

#picturelist {
text-align:right;
list-style-type:none;
margin-right:15px;
margin-left:30px;

}

#picturelist li {
float:right;
margin-right:20px;
margin-bottom:10px;
font-weight:bold;
color:#777777;

}

#picturelist img{
display:block;
border:1px solid #CE3095;

}

#picturelist img:hover{
border:1px solid #F4C0DA;

}

#picturelist a{
color:#777777;
text-decoration:none;

}

#picturelist a:hover{
color:#999999;

推荐答案

arteccentrix写道:
arteccentrix wrote:

请耐心等待我,因为我不熟悉Firefox和CSS。我已经通过许多小组浏览了我的

拥有类似的问题,但无法找到明确的答案。如果有人在这里可以帮助我

我非常感谢你的共享专业知识。


我的背景图片在IE中显示正常,有时在

Firefox直到我点击重新加载按钮。似乎浏览器无法找到图像并从我的webhost中抛出图形

关于远程图像托管。它不是远程托管的图像,

它就在我的图像文件夹中以及CSS文件中。
Please bear with me as I am new to both Firefox and CSS. I have
browsed through a number of groups looking for similar problems to my
own but can''t find a definitive answer. If anyone here can help me
out I would appreciate your shared expertise so much.

My background image is displaying fine in IE, and, sometimes in
Firefox until I hit the reload button. It seems as if the browser is
unable to locate the image and throws up a graphic from my webhost
regarding remote image hosting. It is not a remotely hosted image,
it''s right there in my images folder along with the CSS file.



你的意思是你的5x5像素.gif,对吗?装载给我,第一次在

几个浏览器。

You mean your 5x5 pixel .gif, right? Loads for me, first time in
several browsers.


如果有人可以看看并指出任何明显的错误CSS

文件位于下方,网址为 http:// www.arteccentrix.5u.com/index3.html


body {

font-family:Verdana,...

字体大小:9px;
body{
font-family:Verdana, ...
font-size:9px;



我的浏览器几乎无法读取。看到这个,并切换到100%:
http:// k75s .home.att.net / fontsize.html

Virtually unreadable in my browsers. See this, and switch to 100%:
http://k75s.home.att.net/fontsize.html


#rgheader {

top:-19pt;
#rgheader{
top:-19pt;



积分用于打印。

Points are for printing.


#rgheader h1 {

字体-size:24px的;
#rgheader h1{
font-size:24px;



使用大约150%左右的东西而不是px。

Use something around 150% or so instead of px.


#content h1 {

字体大小:16pt;
#content h1{
font-size:16pt;



使用大约130%左右的东西而不是pt。


最重要的是......你绝对需要*将图像大小调整为<​​br />
确切大小(以像素为单位)。示例:

http:// www.arteccentrix.5u.com/image...ites_006-2.jpg

对于53.85 KB(55,139字节)的缩略图来说太大了

你想显示一个物理大小的480px×342px文件的100px×99px



永远不要通过HTML属性调整图像大小。

这个缩略图最多可能是5到8 KB。


真正广泛的图片受到很大影响。


右对齐英文文本很难以阅读。

低对比度的文字难以阅读。


没有看任何其他页面。

-

-bts

-警告:我为草坪鹿刹车

Use something around 130% or so instead of pt.

And most of all ... you definitely *need* to resize your images to the
exact size in pixels you want to display. Example:

http://www.arteccentrix.5u.com/image...ites_006-2.jpg
is way too large for a thumbnail at 53.85 KB (55,139 bytes)
and you want to display 100px × 99px
of a physically sized 480px × 342px file.
Never resize an image via HTML attributes.
This thumbnail should be maybe 5 to 8 KB at most.

The really wide pictures suffer greatly.

Right-justified English text is very hard to read.
Low-contrast text is hard to read.

Didn''t look at any other pages.

--
-bts
-Warning: I brake for lawn deer


2006 -07-05,arteccentrix写道:
On 2006-07-05, arteccentrix wrote:

请关注我,因为我不熟悉Firefox和CSS。我已经通过一些团体浏览了

来寻找与我自己类似的问题,但

无法找到明确的答案。如果有人在这里可以帮助我,我会非常感谢你的共享专业知识。


我的背景图片在IE中显示得很好,有时在Firefox中

,直到我点击重新加载按钮。似乎浏览器无法找到图像并从我的webhost中抛出一个图形关于

远程

图像托管。它不是远程托管的图像,它就在

我的图像文件夹和CSS文件中。


如果有人可以看看并指出CSS文件

下面的任何明显错误,并且网址是 http://www.arteccentrix.5u.com/index3.html



你遇到的问题比较多;看看它在我的系统中的显示方式
Firefox 1.5.0.4中的
(380K):

< http://cfaj.freeshell.org/www/www.arteccentrix。 5u.jpg>。

You have more problems than that; see how it appears in my system
in Firefox 1.5.0.4 (380K):
<http://cfaj.freeshell.org/www/www.arteccentrix.5u.jpg>.


/ * CSS Document * /


* {

body :0;

填充:0;

保证金:0;


}


body {

background:url( http://www.arteccentrix.5u.com/images/bgstripes.gif);

font-family:Verdana,Arial,Helvetica,sans-serif ;

字体大小:9px;
/* CSS Document */

*{
body:0;
padding:0;
margin:0;

}

body{
background:url(http://www.arteccentrix.5u.com/images/bgstripes.gif);
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:9px;



这太小了。它在我的浏览器中是清晰的,因为我

设置了最小尺寸。


没有必要在任何地方设置主文本的字体大小

除了100%或1em之外;用户应将其默认字体大小设置为适当大小。

That''s far too small. It is legible in my browser only because I
have a minimum size set.

There is no need to set the font size for the main text at anything
other than 100% or 1em; user should have their default font sizes
set at an appropriate size.


margin-top:75px;

text-align:center;

颜色:#777777;


}


#wrapper {

位置:相对;

margin-left:auto;

margin-right:auto;

padding-top: 100px;

宽度:800px;

身高:600px;

背景颜色:#FFFFFF;

border :2px solid#CE3095;


}


#rgheader {

text-align:right;

宽度:50%;

位置:绝对值;

右:15px;

顶部:-19pt;


}


#rgheader h1 {

font-weight:打火机;

字体-size:24px的;
margin-top:75px;
text-align:center;
color: #777777;

}

#wrapper{
position:relative;
margin-left: auto;
margin-right: auto;
padding-top:100px;
width:800px;
height:600px;
background-color:#FFFFFF;
border: 2px solid #CE3095;

}

#rgheader{
text-align:right;
width:50%;
position:absolute;
right:15px;
top:-19pt;

}

#rgheader h1{
font-weight:lighter;
font-size:24px;



如上所述,使用相对大小。

As noted above, use relative sizes.


}


#rglinks {

职位:绝对;

填充:10px;

top:0;

左:0;


}


#rglinks ul {

显示:内联;

list-style:none;

margin:0px;


}


#rglinks li {

font-weight:bold;

显示:内联;


}


#rglinks a {

颜色:#777777;

text-decoration:none;

margin-right:10px;

border-top:3px solid#CE3095;


}


#rglinks a:悬停{

border-top:3px solid#F4C0DA;


}


#content {

width:auto ;

身高:500px;


}


#content h1 {

text-align:right;

margin-right:20px;

margin-left:200px;
}

#rglinks{
position:absolute;
padding:10px;
top:0;
left:0;

}

#rglinks ul{
display:inline;
list-style:none;
margin:0px;

}

#rglinks li{
font-weight:bold;
display:inline;

}

#rglinks a{
color:#777777;
text-decoration:none;
margin-right:10px;
border-top:3px solid #CE3095;

}

#rglinks a:hover{
border-top:3px solid #F4C0DA;

}

#content{
width:auto;
height:500px;

}

#content h1{
text-align:right;
margin-right:20px;
margin-left:200px;



200px可以是窗口的一半(或更多)到窗口的十分之一(或更少)的任何东西。


-

Chris FA Johnson,作者< http://cfaj.freeshell.org>

Shell Scripting Recipes:A Problem -Solution Approach(2005,Apress)

=====我在这篇文章中的代码(如果有的话)假设POSIX语言环境

=====并且被释放根据GNU通用公共许可证

200px could be anything from half the window (or more) to one
tenth (or less) of the window.

--
Chris F.A. Johnson, author <http://cfaj.freeshell.org>
Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)
===== My code in this post, if any, assumes the POSIX locale
===== and is released under the GNU General Public Licence


arteccentrix< mo ***** @ btinternet.comwrote:

< snip>
arteccentrix <mo*****@btinternet.comwrote:
<snip>

我的背景图片在IE中显示正常,有时在Firefox

中,直到我点击重新加载按钮。似乎浏览器无法找到图像并从我的webhost中抛出一个图形关于

远程

图像托管。它不是一个远程托管的图像,它就在

我的图像文件夹和CSS文件中。
My background image is displaying fine in IE, and, sometimes in Firefox
until I hit the reload button. It seems as if the browser is unable to
locate the image and throws up a graphic from my webhost regarding
remote
image hosting. It is not a remotely hosted image, it''s right there in
my images folder along with the CSS file.



我怀疑网站配置中的某些东西阻止了

服务器将背景图像视为本地文件。尝试:


背景:url(" /images/bgstripes.gif");


代替。顺便说一下,我总是在网址(...)中加上引号但是它们不是必需的b $ b。


-

Ben。

I suspect that something in the site''s configuration is stopping the
server from treating the background image as a local file. Try:

background:url("/images/bgstripes.gif");

instead. BTW, I''ve always put quotes inside url(...) but they are not
required.

--
Ben.


这篇关于CSS背景Firefox?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆