Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
É o Seguinte, consegui colocar o background,o layout, tudo pro CSS, porém meu footer e meu menu são imagens, e não consegui coloca-los no arquivo.css , alguem sabe como fazer ? meu menu é feito de imagens rollover, e meu footer de um conjunto de 3 imagens, queria coloca-los no arquivo.css, pra deixar o site levissimo.
Grato
HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="[http://www.w3.org/1999/xhtml">](http://www.w3.org/1999/xhtml)
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>..:: Dalci Pneus ::..</title>
<style>@import "indexcss.css";</style>
<script type="text/javascript">function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}</script>
</head>
<body onload="MM_preloadImages('Imagens/botaoc1.png','Imagens/botaoc2produtos.png','Imagens/botaoc2marcas.png','Imagens/botaoc2loja.png','Imagens/botaoc2contato.png')">
<div id="container">
<div id="header"></div>
<div id="mainnav"></div>
<div id="menu"><img src="Imagens/botãomin.png" width="230" height="70" /><a href="indexcss.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image3','','Imagens/botaoc1.png',1)"><img src="Imagens/botao1.png" name="Image3" width="230" height="50" border="0" id="Image3" /></a><a href="produtos.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image5','','Imagens/botaoc2produtos.png',1)"><img src="Imagens/botao2produtos.png" name="Image5" width="230" height="70" border="0" id="Image5" /></a><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image6','','Imagens/botaoc2marcas.png',1)"><img src="Imagens/botao2marcas.png" name="Image6" width="230" height="70" border="0" id="Image6" /></a><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image7','','Imagens/botaoc2loja.png',1)"><img src="Imagens/botao2loja.png" name="Image7" width="230" height="70" border="0" id="Image7" /></a><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image8','','Imagens/botaoc2contato.png',1)"><img src="Imagens/botao2contato.png" name="Image8" width="230" height="70" border="0" id="Image8" /></a></div>
<div id="contents"><img src="Imagens/textohome.png" width="635" height="600"></div>
<div id="footer"><img src="Imagens/baixoparte1.png" width="318" height="100" /><a href="[http://www.scorro.com.br/simulador/default.asp?cache=200881231216656"](http://www.scorro.com.br/simulador/default.asp?cache=200881231216656) target="_blank"><img src="Imagens/baixoparte2.png" width="280" height="100" /></a><img src="Imagens/baixoparte3.png" width="280" height="100" /></div>
</div>
</body>
</html>CSS
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="[http://www.w3.org/1999/xhtml">](http://www.w3.org/1999/xhtml)
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css"> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<title>Styling the footer</title>
<style type="text/css" media="screen">
style type="text/css" media="screen">
#bodymargin: 0;
padding: 0;
font: 85% arial, hevetica, sans-serif;
text-align: center;
color: #505367;
background-image: url(Imagens/fundo.png);
}body {
background-image: url(Imagens/fundo.png);
}
#bodymargin: 0;
padding: 0;
font: 85% arial, hevetica, sans-serif;
text-align: center;
color: #505367;
background-image: url(Imagens/fundo.png);
}
#container margin: 1em auto;
width: 955px;
margin: auto;
text-align: center;
}
#headerheight: 175px;
background-image: url(Imagens/banner.png);
}
#mainavheight: 25px;
background-color: green;
}
#menufloat: left;
width: 180px;
height: 100px;
#contentsmargin-right: 10px;
margin-left: 20px;
height: 800px;
width:800x;
}
#footerclear: both;
height: 20px;
background-color: lime;
}
#footer2 clear: both;
height: 20px;
background-color: #333;
}
</style>
</body>
</html>Se der, ja me diz as linhas inuteis, pq fiz uma "embolaceira" na hora de por o fundo.
Eu queria tirar o menu e o footer do html e por no cSS, pra carregar melhor
Sim. Está uma bela confusão. :blink:
Primeiro http://forum.imasters.com.br/public/style_emoticons/default/seta.gif valide seu documento HTML - 16 erros - e seu CSS - 1 erro.
Segundo http://forum.imasters.com.br/public/style_emoticons/default/seta.gif o seu CSS está em um arquivo externo, correto? Então não pode haver tags HTML. Deixe só as propriedades CSS no arquivo externo.
Terceiro: como se trata de imagens, poste um link para sua página para melhor ajudar. ;)
http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
aqui deu, 11 erros html e 1 erro CSS
O que seria esse erro:
>
Line 45, Column 73: required attribute "alt" not specified
…ãomin.png" width="230" height="70" /><a href="indexcss.html" onmouseout="MM_s
✉
The attribute given above is required for an element that you've used, but you have omitted it. For instance, in most HTML and XHTML document types the "type" attribute is required on the "script" element and the "alt" attribute is required for the "img" element.
Typical values for type are type="text/css" for <style> and type="text/javascript" for <script>.
ja ja posto a imagem
Você não especificou o atributo alt="" da imagem.
Não é muito interessante aprender do jeito que você está fazendo. Seria legal pegar um tempo para estudar e depois aplicar no seus trabalho. ;)
É só traduzir. :D
http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
No CSS tem só que tirar as tags , <html> e </html> certo ?
Não intendi essa do alt da imagem, tenho que escrever esta tag? alt="" ? Pra que serve, qual a necessidade ?
imagem: http://i285.photobucket.com/albums/ll72/Tuk_/img-2.png
minha intenção é colocar o menu ali que tem imagens rollovers no CSS,( pra ficar no cache e carregar mais rapido), e colocar tbm o footer ali que são tres imagens,uma do lado da outra.
Grato
O alt é um atributo. Na imagem ele funciona com texto alternativo caso ela não apareça.
Sobre essa técnica que deseja fazer no menu, pesquise por CSS Sprite. Coloquei um screencast na área de artigos, tutoriais e materias. ^_^
http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
valeu pela ajuda ae cara (Y)
Decidi não colocar o menu no CSS, pq não vai diminuir muito o tamanho do Html.
Só mais uma pergunta, 317k é muito peso pra uma pagina ?
Depende do site, man. Mas por exemplo, o Terra que tem muito conteúdo possui 187 KBytes. http://forum.imasters.com.br/public/style_emoticons/default/coolio.gif
http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
Mostre-nos como está fazendo, HTML e CSS. ^_^
http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif