Even kort mijn voorgeschiedenis: Twee dagen geleden ben ik begonnen met het maken van een website. Ik wil gebruik maken van css. Nu heb ik een template gedownload, maar ik loop vast.
Mijn body template van me stylesheet is als volgt:
| Code: |
#bodyPanel{width:762px; height:640px; position:relative; margin:0 auto; padding:0;}
#bodyPanel h2{ background:#fff; display:block; width:250px; height:50px; margin:0; font:30px/30px Georgia, "Times New Roman", Times, serif; font-weight:normal; padding:4px 0 0 202px; color:#FF7113;}
#bodyPanel p{background:url(images/symbol.jpg) 0 0 no-repeat #fff; margin:0 0 0 54px; padding:0 42px 35px 150px; color:#0F0F0F;}
#bodyPanel p span{font-weight:bold;}
#bodyPanel p.dotline{background:url(images/dot-line.gif) 0 0 repeat-x #fff; padding:0; margin:0 40px 0 25px; color:#000;}
#bodyPanel p.capstext{background: url(images/name.gif) bottom right no-repeat #fff; font:18px/24px Georgia, "Times New Roman", Times, serif; font-style:italic; color:#555555; padding:2px 10px 0 25px ; margin:0 35px 10px 0; }
#bodyPanel p.more{height:26px; padding:0; background:none; margin:0;}
#bodyPanel p.more a{width:76px; height:26px; display:block; margin:314px 20px 19px 618px; background:url(images/more.gif) 0 0 no-repeat #fff; color:#555; text-decoration:none; font:15px/26px "Trebuchet MS",Arial, Helvetica, sans-serif; padding:0 0 0 10px; text-transform:uppercase; position:absolute; top:0px; right:0px;}
#bodyPanel p.more a:hover{background:url(images/more.gif) 0 0 no-repeat #fff; color:#216EBD; text-decoration:none;}
|
Verder niet relevant
Als ik de afbeelding van #bodyPanel p{background:url(images/symbol.jpg) wijzig verandert gelijk de afbeelding op alle pagina's. (maak gebruik van .dwt). Maar hoe kan ik nu deze afbeelding wijzigen voor op een andere pagina? In mijn broncode komt namelijk deze verwijzing niet terug:
| Code: |
<div class="active" id="bodyPanel">
<h2>Home</h2>
<p>Trial Services is a <span>free, tableless, W3C-compliant</span> web design layout by Template World. This template has been tested and proven compatible with all major browser environments and operating systems. You are free to modify the design to suit your tastes in any way you like. </p>
<p class="dotline"><img src="images/blank.gif" alt="" width="1" height="1" /></p>
<p class="capstext">If you are interested in seeing more of our free web template designs feel free to visit our website, Template World. We intend to add at least 25 new free templates in the coming month.</p>
<p class="dotline"><img src="images/blank.gif" alt="" width="1" height="1" /></p>
<p class="more"><a href="#">More</a></p>
|
