2. Liikkuvaa kuvaa https://peda.net/id/338d5aa495d 2016-05-16T08:04:04+03:00 https://peda.net/:static/535/peda.net.logo.bg.svg <div class="license">Tämän sivun lisenssi <a rel="license" href="https://peda.net/info">Peda.net-yleislisenssi</a></div> Liikuva kuva https://peda.net/id/338deb7295d 2016-05-16T08:01:58+03:00 <p>Käytä CSS ominaisuutta jos tahdot kuvasi liikkuvan.</p> <p>Kuva voi liikkua oikealta vasemmalle tässä esimerkki koodissa:</p> <div class="w3-example"> <h3>Esimerkki</h3> <div class="w3-code notranslate htmlHigh"><span><span>&lt;</span>p<span>&gt;</span></span><br/> <span><span>&lt;</span>img<span> src<span>=&quot;smiley.gif&quot;</span> alt<span>=&quot;Hymiö&quot;</span> style<span>=&quot;float:right;width:42px;height:42px;&quot;</span></span><span>&gt;</span></span><br/> Kuva liukuu oikealle tekstissä.<br/> <span><span>&lt;</span>/p<span>&gt;</span></span><br/> <br/> <span><span>&lt;</span>p<span>&gt;</span></span><br/> <span><span>&lt;</span>img<span> src<span>=&quot;smiley.gif&quot;</span> alt<span>=&quot;Hymiö&quot;</span> style<span>=&quot;float:left;width:42px;height:42px;&quot;</span></span><span>&gt;</span></span><br/> Kuva liukuu vasemmalle tekstissä.<br/> <span><span>&lt;</span>/p<span>&gt;</span></span></div> </div> <h2>Kuva kartta</h2> <p>Käytä &lt;map&gt; tagia määrittääksesi kuvakartan. Kuva kartta on kuva josta voit tietyistä kohdista klikata linkkejä.</p> <p>&lt;map&gt; tagi sisältää numeroita &lt;area&gt; tagista, jotka määrittää klikattavat alueet kuva kartasta:</p> <div class="w3-example"> <h3>Esimerkki</h3> <div class="w3-code notranslate htmlHigh"><span><span>&lt;</span>img<span> src<span>=&quot;planets.gif&quot;</span> alt<span>=&quot;Planeetta&quot;</span> usemap<span>=&quot;#planetmap&quot;</span>style<span>=&quot;width:145px;height:126px;&quot;</span></span><span>&gt;</span></span><br/> <br/> <span><span>&lt;</span>map<span> name<span>=&quot;planetmap&quot;</span></span><span>&gt;</span></span><br/> <span><span>&lt;</span>area<span> shape<span>=&quot;rect&quot;</span> coords<span>=&quot;0,0,82,126&quot;</span> alt<span>=&quot;Sun&quot;</span> href<span>=&quot;sun.htm&quot;</span></span><span>&gt;</span></span><br/> <span><span>&lt;</span>area<span> shape<span>=&quot;circle&quot;</span> coords<span>=&quot;90,58,3&quot;</span> alt<span>=&quot;Mercury&quot;</span> href<span>=&quot;mercur.htm&quot;</span></span><span>&gt;</span></span><br/> <span><span>&lt;</span>area<span> shape<span>=&quot;circle&quot;</span> coords<span>=&quot;124,58,8&quot;</span> alt<span>=&quot;Venus&quot;</span> href<span>=&quot;venus.htm&quot;</span></span><span>&gt;</span></span><br/> <span><span>&lt;</span>/map<span>&gt;</span></span></div> </div> 2018-08-02T00:45:25+03:00