Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> [HTML][CSS][PHP]Jak wstawić obrazek do div-a z innym obrazkiem, by sie pozycjonowałem wzgledem tego obrazka
Darek82
post 4.05.2010, 17:14:19
Post #1





Grupa: Zarejestrowani
Postów: 130
Pomógł: 0
Dołączył: 27.04.2009

Ostrzeżenie: (0%)
-----


Mam na głównej stronie w div="header" obrazek, chciałbym wstawić inne zdjecie div=lewy_obrazek które by zmieniało miejsce tylko w obrębie obszaru tego obrazka "header" i by w kazdej rozdzielczosci ekranu bylo w w tym samym miejscu by sie nie rozjezdzało, obrazek chciałbym dodać w css jak mógłbym to zrobić czy ten nowy obrazek mam w div wstawić wogóle?

  1. </head>
  2.  
  3.  
  4. <body id="page_bg">
  5.  
  6. <div id="wrapper">
  7. <div id="lewy_obraz">
  8. <div id="header">
  9.  
  10. <div class="logo">
  11.  
  12. <table cellpadding="0" cellspacing="0">
  13. <tr>
  14. <td>
  15. <h1><a href="index.php"><?php echo $mainframe->getCfg('sitename') ;?></a></h1>
  16. </td>
  17. </tr>
  18. </table>
  19. </div>
  20. <div id="search"><jdoc:include type="modules" name="user4" /></div>
  21. <div class="clr"></div>
  22. <div class="newsflash<?php if(!$this->countModules('user1') and JRequest::getCmd('layout') != 'form') : ?> only<?php endif; ?>">
  23. <jdoc:include type="modules" style="rounded" name="top" />
  24. </div>
  25. <div id="pillmenu">
  26. <?php if($mtype != "module") :
  27. echo $mainnav;
  28. else: ?>
  29. <jdoc:include type="modules" name="user3" />
  30. <?php endif; ?>
  31. </div>
  32. <div class="clr"></div>
  33. <div class="cpathway"><jdoc:include type="module" name="breadcrumbs" /></div>
  34. </div>
  35.  
  36. <div id="content">
  37.  
  38. <?php if($this->countModules('left') and JRequest::getCmd('layout') != 'form') : ?>
  39. <div id="leftcolumn">
  40. <jdoc:include type="modules" name="left" style="rounded" />
  41. <br />
  42. <?php $sg = 'banner'; include "templates.php"; ?>
  43. <br />
  44. </div>
  45. <?php endif; ?>
  46.  
  47. <?php if($this->countModules('left') and $this->countModules('right') and JRequest::getCmd('layout') != 'form') : ?>
  48. <div id="maincolumn">
  49. <?php elseif($this->countModules('left') and !$this->countModules('right') and JRequest::getCmd('layout') != 'form') : ?>
  50. <div id="maincolumn_left">
  51. <?php elseif(!$this->countModules('left') and $this->countModules('right') and JRequest::getCmd('layout') != 'form') : ?>
  52. <div id="maincolumn_right">
  53. <?php else: ?>
  54. <div id="maincolumn_full">
  55. <?php endif; ?>
  56.  
  57. <div class="nopad">
  58. <jdoc:include type="message" />
  59. <?php if($this->params->get('showComponent')) : ?>
  60. <jdoc:include type="component" />
  61. <?php endif; ?>
  62. </div>
  63. </div>
  64.  
  65. <?php if($this->countModules('right') and JRequest::getCmd('layout') != 'form') : ?>
  66. <div id="rightcolumn">
  67. <jdoc:include type="modules" name="right" style="rounded" />
  68. </div>
  69. <?php endif; ?>
  70. <div class="clr"></div>
  71.  
  72. </div>
  73.  
  74. <div id="content_b">
  75. <div id="footer">
  76. <jdoc:include type="modules" name="debug" />
  77. <?php $sg = ''; include "templates.php"; ?>
  78. <a href="http://validator.w3.org/check/referer">valid xhtml</a>
  79. <a href="http://jigsaw.w3.org/css-validator/check/referer">valid css</a>
  80. </div>
  81.  
  82.  
  83. </div>
  84. <div id="prawy_obraz">
  85. </div>
  86. </div>
  87.  
  88. </div>
  89. </body>
  90. </html>
  91.  


Ten post edytował Darek82 4.05.2010, 17:21:12
Go to the top of the page
+Quote Post
krzysztof_kf
post 4.05.2010, 17:19:57
Post #2





Grupa: Zarejestrowani
Postów: 1 135
Pomógł: 158
Dołączył: 19.03.2009
Skąd: Toruń

Ostrzeżenie: (0%)
-----



  1.  
  2. #header {
  3. width: 1000px;
  4. height: 200px;
  5. margin: 0 auto;
  6. }
  7.  
  8. #header-left {
  9. width: 200px;
  10. float: left;
  11. background: #00ff00 url(obrazek.png) no-repeat;
  12. }
  13.  
  14. #header-right {
  15. width: 800px;
  16. float: left;
  17. background: #3399ff url(obrazek.png) no-repeat;
  18. }


i kod

  1.  
  2. <div id="header">
  3. <div id="header-left">
  4.  
  5. </div>
  6. <div id="header-right">
  7. </div>
Go to the top of the page
+Quote Post
Darek82
post 4.05.2010, 17:41:27
Post #3





Grupa: Zarejestrowani
Postów: 130
Pomógł: 0
Dołączył: 27.04.2009

Ostrzeżenie: (0%)
-----


ekstra pomogłeś mi smile.gif
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 25.04.2025 - 08:15