| ||
|
Как да си направите галерия с CSS.Създайте файл с име style1.css отворете го и напишете следния код: #zagl {position: absolute; top: 10px; left: 185; width: 500px; text-align: center; color: black; font-family: comic sans MS} #pix {position: absolute; top: 0px; left: 0px} #pix2 {position: absolute; top: 0px; left: 700px} dt {margin: 10px} img {border: none; width: 115px} #pix a img.skr {width: 500px; position: absolute; top: 60px; left: 165px; visibility: hidden} #pix a:active {background: gray} #pix a:active img.skr {visibility: visible} #pix2 a img.skr {width: 500px; position: absolute; top: 60px; left: -515px; visibility: hidden} #pix2 a:active {background: gray} #pix2 a:active img.skr {visibility: visible} После създайте файл например, gallery.html и напишете този код вътре: <html> <link href="style2.css" rel="stylesheet" type="text/css"> <head> <title>Галерия</title> <meta http-equiv="Content-Type" content="text/html; charset="windows-1251"> </head> <body leftmargin="0" topmargin="0"> <h3 id="zagl">Галерия.</h3> <dl id="pix"> <dt><a href="http://uroci.net/#"><img src="img1.jpg"> <img class="skr" src="img1.jpg"> </a> </dt> <dt><a href="http://uroci.net/#"><img src="img2.jpg"> <img class="skr" src="img2.jpg"> </a> </dt> <dt> <a href="http://uroci.net/#"><img src="img3.jpg"> <img class="skr" src="img3.jpg"> </a> </dt> <dt> <a href="http://uroci.net/#"><img src="img4.jpg"> <img class="skr" src="img4.jpg"> </a> </dt> <dt> <a href="http://uroci.net/#"><img src="img5.jpg"> <img class="skr" src="img5.jpg"> </a> </dt> <dt> <a href="http://uroci.net/#"><img src="img6.jpg"> <img class="skr" src="img6.jpg"> </a> </dt> </dl> <dl id="pix2"> <dt> <a href="http://uroci.net/#"><img src="img7.jpg"> <img class="skr" src="img7.jpg"> </a> </dt> <dt> <a href="http://uroci.net/#"><img src="img8.jpg"> <img class="skr" src="img8.jpg"> </a> </dt> <dt> <a href="http://uroci.net/#"><img src="img9.jpg"> <img class="skr" src="img9.jpg"> </a> </dt> <dt> <a href="http://uroci.net/#"><img src="img10.jpg"> <img class="skr" src="img10.jpg"> </a> </dt> <dt> <a href="http://uroci.net/#"><img src="img11.jpg"> <img class="skr" src="img11.jpg"> </a> </dt> <dt> <a href="http://uroci.net/#"><img src="img12.jpg"> <img class="skr" src="img12.jpg"> </a> </dt> </dl> </body> </html>
|
|