Keskustelu: Nettisivujen teko: Koodissa vikaa?

Onko koodissa vikaa? yritän laittaa sitä WordPressin hallintapaneelissa olevaan sivuston koodiin, mutta kuva ei vain näy: background: #FFF url(images/contentback.gif) background repeat-x;

W3C kertoo asiasta näin:

'background'
[<'background-color'> || <'background-image'> || <'background-repeat'> || <'background-attachment'> || <'background-position'>] | inherit

Eli käytännössä:

background: #fff url(images/contentback.gif) repeat-x;

Pitäisi toimia (en testannut). Eli koodissasi tuo background tuolla välissä on turha.

Yleensä itse määrittelen taustavärin/kuvan erikseen käyttämällä esim. background-color- ja background-image-attribuutteja esimerkiksi näin:

background-color: #fff;
background-image: url('images/contentback.gif');
background-repeat: repeat-x;

Minusta nuo on helpompi muistaa (ei tarvitse arpoa arvojen järjestystä) ja selkeyttää lukemista myöhemminkin.

^Sama täällä, mutta tuolla mainitsemallani tavalla ulkoasuun oli laitettu eräs toinen kuva. Kokeilin kumpaakin tapaa.

Onhan kuvan polku varmasti oikein?

Kokeile myös viedä CSS-tiedosto validaattorin läpi:
http://jigsaw.w3.org/css-validator/

Koodi toimii. Mutta jos repeat-x laittaa taustan niin, että se näkyy vain kerran ylhäällä, niin mikä repeat laittaa kuvan näkymään ainoastaan alhaalla?

background-repeat määrittelee, mihin suuntaan taustakuvaa toistetaan, ei sen sijaintia. Esim. repeat-x toistaa taustakuvaa loputtomasti vaakatasossa (x-akselilla).

Taustakuvan sijainti määritellään background-position-attribuutilla. Esimerkiksi

background-repeat: repeat-x;
background-position: bottom;

sijoittaa taustakuvan sivun alareunaan ja toistaa sitä vaakatasossa loputtomasti.

<?php get_header(); ?>
<!--page.php-->

<!--include sidebar-->
<?php include(TEMPLATEPATH."/l_sidebar.php");?>
<!--include sidebar-->
<?php include(TEMPLATEPATH."/r_sidebar.php");?>
<div id="content">
<p style="float:right;width:225px;margin:15px;padding:5px;background: #000000 url(wp-content/themes/rockin-chrome-1/images/laatikko6.PNG);color:#FE0309;clear: both;font-size: 100%;">

</p>


    <!--loop-->
    <?php if (have_posts()) : while (have_posts()) : the_post(); ?>

                 <!--post title-->
		<h2 id="post-<?php the_ID(); ?>"><?php the_title(); ?></h2>
		<div class="postspace2">

	</div>
                              <!--post with more link -->
				<?php the_content('<p class="serif">Lue lisää &raquo;</p>'); ?>

	                       <!--if you paginate pages-->
				<?php link_pages('<p><strong>Sivut:</strong> ', '</p>', 'number'); ?>

<tr> <td> <?php comments_template(); // Get wp-comments.php template ?>
</td> </tr>


	<!--end of post and end of loop-->
	  <?php endwhile; endif; ?>

         <!--edit link-->
	<?php edit_post_link('Edit this entry.', '<p>', '</p>'); ?>

</div>

<!--page.php end-->

<!--include footer-->
<?php get_footer(); ?>

^Mikä koodissa mättää? Tuo laatikko jonka olen tuohon koodannut, ei näy etusivulla. Muilla sivuilla, joilla pitäisikin se kuitenkin toimii...

Mod. lisäsi kooditagit

Lähetin palvelimelta koneelle koodin, joka oli tiedostomuodossa .tpl. Muutin tiedoston .txt muotoon, jotta voisin muokata sitä muisiolla. Kuinka saan tämän nyt takaisin .tpl:ksi?

Antamalla sille tiedostolle nimen, joka loppuu merkkeihin .tpl?