Problem med css-mall

10 svar · 379 visningar · startad av macgunde 12 jan. 2004

macgundeMedlem sedan apr. 2003112 inlägg

12 jan. 2004 09:53#1

Har ett litet problem...

body,td,th {color: #cccccc
} denna gör så att all vanlig text blir grå.

.style3 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-color: rgb(0,0,0);
} Denna ska göra texten svart, men det funkar inte pga att den taggen ovan verkar prioterad...

Jag har testat att tar bort den översta css taggen, med resultatet att allt blev svart. .style2 som fortfarande ska vara grå funkar då inte...
.style2 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
font-size: 13px;
font-color: rgb(204,204,204);
}

Jag har lagt in färger på alla .style#, men det verkar ändå inte att funka... :(

<!--
body,td,th {color: #cccccc
}

body {
	background-color: #000000;
}

a:link { text-decoration: none; color: #ffffff}
a:visited { text-decoration: none; color: #ffffff}
a:active { text-decoration: none; color: #ffffff}
a:hover { color: #cccccc}

.style1 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold; 
	font-size: 10px;
font-color: rgb(204,204,204);
}
.style2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold; 
	font-size: 13px;
  font-color: rgb(204,204,204);
}
.style3 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
  font-color: rgb(0,0,0);
}
-->

jarvkloMedlem sedan juli 20013 295 inlägg

12 jan. 2004 10:05#2

Hmm...
Skriv bara

[b]color[/b]:rgb(0,0,0);

precis som du gör i dina första regler (t.ex. den för body) - font-color finns inte ;)

macgundeMedlem sedan apr. 2003112 inlägg

12 jan. 2004 10:08#3

jarvklo skrev:

Hmm...
Skriv bara
[b]color[/b]:rgb(0,0,0);
precis som du gör i dina första regler (t.ex. den för body) - font-color finns inte ;)

Tackar! Alltid lär man sig något nytt :D

Vad är att föredra extern eller intern css?
Hur funkar länkning från en extern css?

JerpaMedlem sedan feb. 20031 749 inlägg

12 jan. 2004 10:18#4

Engine^Medlem sedan dec. 20002 861 inlägg

12 jan. 2004 10:21#5

Extern css är väl att föredra. Det blir renare dokument då. Själva länkningen går väl att göra på några olika sätt, men jag gissar på att dessa två är vanligast...

<style type="text/css">
<!--
@import url(stylesheet.css);
-->
</style>

eller...

<link rel="stylesheet" href="stylesheet.css" type="text/css">

macgundeMedlem sedan apr. 2003112 inlägg

12 jan. 2004 12:35#6

Tackar

macgundeMedlem sedan apr. 2003112 inlägg

12 jan. 2004 13:14#7

Varför visas inte bakgrundsfärgen???

<style type="text/css">
<!--

body {
background-color: black;
}

a:link { text-decoration: none; color: #ffffff}

a:visited { text-decoration: none; color: #ffffff}

a:active { text-decoration: none; color: #ffffff}

a:hover { color: #cccccc}

.style1 {
  color: #cccccc;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold; 
	font-size: 10px;
  
}
.style2 {
  color: #cccccc;
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-weight: bold; 
	font-size: 13px;

}
.style3 {
  color: #000000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
  
}
-->
</style>

jarvkloMedlem sedan juli 20013 295 inlägg

12 jan. 2004 14:36#8

Hmm..
Omöjligt att säga utan att ha fått se den resulterande HTML-koden (dvs den HTML-kod vad din PHP-sida skapar)

Har du en länk till sidan ?

macgundeMedlem sedan apr. 2003112 inlägg

12 jan. 2004 14:50#9

Koden från html dokumentet...

<html>
<head>
<title>Portfolio2004</title>

<link rel="stylesheet" href="stylesheet.css" type="text/css">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<SCRIPT LANGUAGE="JavaScript">
    <!--
    
    // Preload all images
    var pic = new image();
    pic.src = "images/dplogga.gif";
    pic.src = "images/block.gif";
    pic.src = "images/bildkloss.gif";
    pic.src = "images/start/over_1.gif";
    pic.src = "images/start/over_2.gif";
    pic.src = "images/start/over_3.gif";
    pic.src = "images/start/over_4.gif";
    pic.src = "images/start/over_5.gif";
    pic.src = "images/start/over_6.gif";
	pic.src = "images/start/under_1.gif";
    pic.src = "images/start/under_2.gif";
    pic.src = "images/start/under_3.gif";
    pic.src = "images/start/under_4.gif";
    pic.src = "images/start/under_5.gif";
    pic.src = "images/start/under_6.gif";
    pic.src = "images/index/over_1.gif";
    pic.src = "images/index/over_2.gif";
    pic.src = "images/index/over_3.gif";
    pic.src = "images/index/over_4.gif";
    pic.src = "images/index/over_5.gif";
    pic.src = "images/index/over_6.gif";
	pic.src = "images/index/under_1.gif";
    pic.src = "images/index/under_2.gif";
    pic.src = "images/index/under_3.gif";
    pic.src = "images/index/under_4.gif";
    pic.src = "images/index/under_5.gif";
    pic.src = "images/index/under_6.gif";
    
        
      function visaBild (bildNamn,bildURL) {
        document[bildNamn].src=bildURL;
      }
      //-->
    </SCRIPT>

</head>

<body>
<div align="center">
  <div class="style1">
    <table width="290" border="1" bgcolor="#666666">
      <tr>
        <th bgcolor="#666666" class="style1" scope="col"><div align="center"> 
          <table width="288" border="0">
                <tr>
                  <th scope="col"><div align="center"><img src="images/dplogga.gif" width="283" height="146"></div></th>
                </tr>
                <tr>
                  <td><div align="center" class="style1">
                  	<img src="images/block.gif" width="1" height="20" border="0">
                  		<a href="html/ommig.html">Om mig</a> &bull; 
                  		<a href="html/director.html">Director</a> &bull; 
                  		<a href="html/webb.html">Webb</a> &bull; 
                  		<a href="html/foto.html">Foto</a> &bull; 
                  		<a href="html/design.html">Design</a> &bull; 
                  		<a href="html/cv.html">Cv</a>
                  	<img src="images/block.gif" width="1" height="20" border="0"></div></td>
                </tr>
                
                
                
                <tr>
                  <td class="style2"><div align="center">
                  <img src="images/block.gif" width="1" height="20" border="0"></a>
                  danielpeterson.cjb.net
                  <img src="images/block.gif" width="1" height="20" border="0"></a></div></td>
                </tr>
                
                
                <tr>
                  <td class="style3">
                  <span id="jxtooltip" style="position:absolute; visibility:hidden;"></span>

<a href="#" onMouseover="tooltip('Mitt namn &auml;r Daniel, f&ouml;dd och uppvuxen i N&auml;ssj&ouml;. Flyttade till Ljungby 2002 f&ouml;r att studera grafisk form. P&aring; min fritid umg&aring;s jag med min flickv&auml;n och mina v&auml;nner. Jag f&ouml;rsker motionera så ofta som m&ouml;jligt (2-3 ggr i veckan). Andra intressen jag har &auml;r kl&auml;ttring, dykning och vandring. N&auml;r jag inte g&ouml;r n&aring;got av detta sitter jag g&auml;rna vid datorn och formger, illustrerar och programmerar.');" onMouseout="tooltip();">
                  <img src="images/bildkloss/index.gif" alt="" title="" name=bildkloss width="283" height="243" border="0"></a>
<script language="JavaScript">
var Xmouse, Ymouse;
var hidden = true;
var preMessage="<div style='background-color:rgb(180,180,180);:border:solid black 2px;font-color:black;font-family:verdana;font-size:12px;'>";
var postMessage="</div>";
function tooltip(message) {
	if(message){
		hidden = false;
		if (document.layers){
			with (document["jxtooltip"].document){
				open();
				write(preMessage + message + postMessage);
				close();
			}
		} else if (document.all) {
			document.all["jxtooltip"].innerHTML = preMessage + message + postMessage;
		} else if (document.getElementById){
//			jxdocrange = document.createRange();
//			jxdocrange.setStartBefore(document.getElementById("jxtooltip"));
//			while (document.getElementById("jxtooltip").hasChildNodes()){
//				document.getElementById("jxtooltip").removeChild(document.getElementById("jxtooltip").lastChild);
//			}
//			document.getElementById("jxtooltip").appendChild(jxdocrange.createContextualFragment(preMessage + message + postMessage));
			document.getElementById("jxtooltip").innerHTML = preMessage + message + postMessage;
		}
		moveLayer("jxtooltip",Xmouse-30,Ymouse+18);
		if (document.all) {
			document.all["jxtooltip"].style.visibility = "visible";
		} else if (document.layers){
			document.layers["jxtooltip"].visibility = "show";
		} else if (document.getElementById){
			document.getElementById("jxtooltip").style.visibility = "visible";
		}
	} else {
		hidden = true;
		if (document.all) {
			document.all["jxtooltip"].style.visibility = "hidden";
		} else if (document.layers){
			document.layers["jxtooltip"].visibility = "hide";
		} else if (document.getElementById){
			document.getElementById("jxtooltip").style.visibility = "hidden";
		}
		moveLayer("jxtooltip",0,0);
	}
}
function MoveHandler(evnt) {
	if(document.all) {
		Xmouse = window.event.x + document.body.scrollLeft;
		Ymouse = window.event.y + document.body.scrollTop;
	} else if(document.layers||document.getElementById){
		Xmouse = evnt.pageX;
		Ymouse = evnt.pageY;
	}
	if(!hidden){ moveLayer("jxtooltip",Xmouse-30,Ymouse+18); }
}
function moveLayer(Id,x,y){
	if (document.all){
		document.all[Id].style.left = x;
		document.all[Id].style.top = y;
	} else if (document.layers){
		document.layers[Id].left = x;
		document.layers[Id].top = y;
	} else if (document.getElementById){
		document.getElementById(Id).style.left = x+'px';
		document.getElementById(Id).style.top = y+'px';
	}
}
if (document.layers){
	document.captureEvents(Event.MOUSEMOVE);
}
document.onmousemove = MoveHandler;
</script>
                      
                  </td>
                </tr>
            </table>
              
              

              <br>
              <table width="100" border="0">
                <tr>
                  <td><a href="html/ommig.html" onMouseover="visaBild ('over_1','images/index/over_1.gif');" onMouseout ="visaBild ('over_1','images/start/over_1.gif');"><img src="images/start/over_1.gif" alt="Om Mig!" title="Om Mig!" name="over_1" width="40" height="40" border="0"></td>
                  <td><a href="html/skola.html" onMouseover="visaBild ('over_2','images/index/over_2.gif');" onMouseout ="visaBild ('over_2','images/start/over_2.gif');"><img src="images/start/over_2.gif" alt="Director!" title="Director!" name="over_2" width="40" height="40" border="0"></td>
                  <td><a href="html/webb.html" onMouseover="visaBild ('over_3','images/index/over_3.gif');" onMouseout ="visaBild ('over_3','images/start/over_3.gif');"><img src="images/start/over_3.gif" alt="Webb!" title="Webb!" name="over_3" width="40" height="40" border="0"></td>
                  <td><a href="html/foto.html" onMouseover="visaBild ('over_4','images/index/over_4.gif');" onMouseout ="visaBild ('over_4','images/start/over_4.gif');"><img src="images/start/over_4.gif" alt="Foto!" title="Foto!" name="over_4" width="40" height="40" border="0"></td>
                  <td><a href="html/design.html" onMouseover="visaBild ('over_5','images/index/over_5.gif');" onMouseout ="visaBild ('over_5','images/start/over_5.gif');"><img src="images/start/over_5.gif" alt="Design!" title="Design!" name="over_5" width="40" height="40" border="0"></td>
                  <td><a href="html/cv.html" onMouseover="visaBild ('over_6','images/index/over_6.gif');" onMouseout ="visaBild ('over_6','images/start/over_6.gif');"><img src="images/start/over_6.gif" alt="Cv!" title="Cv!" name="over_6" width="40" height="40" border="0"></td>
                </tr>
                <tr>
                  <td><img src="images/start/under_1.gif" alt="" title="" name="under_1" width="40" height="40" border="0"></td>
                  <td><img src="images/start/under_2.gif" alt="" title="" name="under_2" width="40" height="40" border="0"></td>
                  <td><img src="images/start/under_3.gif" alt="" title="" name="under_3" width="40" height="40" border="0"></td>
                  <td><img src="images/start/under_4.gif" alt="" title="" name="under_4" width="40" height="40" border="0"></td>
                  <td><img src="images/start/under_5.gif" alt="" title="" name="under_5" width="40" height="40" border="0"></td>
                  <td><img src="images/start/under_6.gif" alt="" title="" name="under_6" width="40" height="40" border="0"></td>
                </tr>
              </table>
        <a href="mailto:gunde@macnytt.se">gunde@macnytt.se</a> </div></th>
      </tr>
    </table>

  </div>
</div>
</body>
</html>

jarvkloMedlem sedan juli 20013 295 inlägg

12 jan. 2004 15:19#10

OK.

Har du möjligen fått med

<style type="text/css">
<!--

och

-->
</style>

i .css-filen ?
Ta bort dem i så fall...

macgundeMedlem sedan apr. 2003112 inlägg

12 jan. 2004 15:32#11

AAh tog bort de, nu funkar de som de ska tackar...