Prosba o pomoc

Josh · Napísal **Josh**: 24.11.2012 18:46

Prosim vas potreboval by som pomoc ako mam nakodovat:

Vzor

Kód:

http://www.upnito.sk/0/f4aqxp3ugk8c3wg5cmz6ghdweubx8gq9.png

ako mam spravit tak ze vedla seba budem mat 3 obrazky s rozmermi 279x164 a vzdialenost od seba 30px. Pod kazdym obrazkom bude Nazov vycentrovany na stred a pod nazvom bude taky kratky popis.

CIze za kazdym obrazom bude pozadie s rozmermi 281x167 a ten obrazok bude unho dnukan s rozmermi 279x164. Pozadie sa nebude dat kopirovat ale iba obrazok ked bude na stranke. Ten obrazok a nazov bude klikaci cize ked kliknes otvori novu stranku.

weroro · Napísal **weroro**: 24.11.2012 20:54

Kód:

<!doctype html>
<html>     
  <head>       
    <meta http-equiv="content-type" content="text/html; charset=utf-8">       
    <title>klikacka</title>       
    <style type="text/css">         
      <!--
        /* nastavenia pre celu stranku [nie to nutne] */
        html,*,body{margin:0;padding:0;}
        html{font-size:100%;}
        body{font-family:'Lucida Grande',Verdana,Helvetica,Arial,sans-serif;color:#000;background-color:#fff;font-size:12px;}
        a{color:#336699;text-decoration:none;}
        a:active,a:visited{color:#336699;text-decoration:none;}
        a:hover{color:#7192bb;text-decoration:underline;}
        /* nezobrazi ramik okolo obrazku */
        img{border:none;}
        
        .clr{clear:both;}
        .wrapper{width:903px; margin:0 auto;}
        /* blok s obrazkom a popisom */
        .imgBlock{width:281px;text-align:center;background:#ccc url('') left top no-repeat;float:left;margin:0 0 10px 30px;}
        .imgBlock a{display:block;width:279px;}
        .imgBlock img{width:279px;height:164px;background:#0f0 url('') left top no-repeat;}
        .imgBlock p{padding:20px 5px 10px 5px;}
        /* reset laveho odsadenia bloku */
        .noMargin{margin-left:0;}                      
       //-->        
    </style>     
  </head>     
  <body>  
    <div class="wrapper">         
      <div class="imgBlock noMargin">             
        <a href="#">                
          <img src="#" alt="obrazok">                
          Lorem ipsum dolor
        </a>             
        <p>
          Lorem ipsum dolor sit amet consectetuer laoreet netus nulla hac nulla. 
          Ligula augue ante id ornare euismod convallis ante et elit ultrices.              
        </p>         
      </div>
      <div class="imgBlock">             
        <a href="#">                
          <img src="#" alt="obrazok">                
          Lorem ipsum dolor
        </a>             
        <p>
          Lorem ipsum dolor sit amet consectetuer laoreet netus nulla hac nulla. 
          Ligula augue ante id ornare euismod convallis ante et elit ultrices.              
        </p>         
      </div>
      <div class="imgBlock">             
        <a href="#">                
          <img src="#" alt="obrazok">                
          Lorem ipsum dolor
        </a>             
        <p>
          Lorem ipsum dolor sit amet consectetuer laoreet netus nulla hac nulla. 
          Ligula augue ante id ornare euismod convallis ante et elit ultrices.              
        </p>         
      </div>
      <div class="imgBlock noMargin">             
        <a href="#">                
          <img src="#" alt="obrazok">                
          Lorem ipsum dolor
        </a>             
        <p>
          Lorem ipsum dolor sit amet consectetuer laoreet netus nulla hac nulla. 
          Ligula augue ante id ornare euismod convallis ante et elit ultrices.              
        </p>         
      </div>
      <div class="imgBlock">             
        <a href="#">                
          <img src="#" alt="obrazok">                
          Lorem ipsum dolor
        </a>             
        <p>
          Lorem ipsum dolor sit amet consectetuer laoreet netus nulla hac nulla. 
          Ligula augue ante id ornare euismod convallis ante et elit ultrices.              
        </p>         
      </div>
      <div class="imgBlock">             
        <a href="#">                
          <img src="#" alt="obrazok">                
          Lorem ipsum dolor
        </a>             
        <p>
          Lorem ipsum dolor sit amet consectetuer laoreet netus nulla hac nulla. 
          Ligula augue ante id ornare euismod convallis ante et elit ultrices.              
        </p>         
      </div>         
      <br class="clr">         
    </div>                                                 
  </body>
</html> 

Josh · Napísal autor témy **Josh**: 26.11.2012 7:39

Prosim ta mohol by si to spravit tak aby to sive pozadie nebolo na tym textom a nazvom? len za obrazkom? tak ako som poslal vyssie vzor. A este jedna vec mohol by si to napisat samostatne ten css? diky

don jebot · Napísal **don jebot**: 26.11.2012 8:49

Josh tu sa mas spytat na radu a pomoc nie na vypracovanie celeho zadania. Take veci patria do ponuky prace a maju byt ohodnotene. Zatial mas stastie, ze to nevidel shaggy ...

Josh · Napísal autor témy **Josh**: 26.11.2012 9:46

som pytal o pomoc ne?

weroro · Napísal **weroro**: 26.11.2012 12:18

Ak tam nechceš to sivé odstráň toto:

Kód:

background:#ccc url('') left top no-repeat;

Do samostatného súboru si to vieš dať aj ty sám. Alebo máš pokazený poznámkový blok (notepad)?
A nepíš zbytočne SS, sám som ti odpovedal, že sa máš pýtať verejne, lebo riešenie tvojho problému, môže pomôcť aj niekomu inému.

Josh · Napísal autor témy **Josh**: 26.11.2012 12:41

Diky za pomoc.

Prosba o pomoc

Podobné témy