Код:
<!--HTML--> <link href='http://fonts.googleapis.com/css?family=Petit+Formal+Script|Marvel' rel='stylesheet' type='text/css'><style type="text/css">.bh {width: 500px; height: 300px; background-image: url(http://funkyimg.com/i/2iB5j.jpg); opacity: 0.0; -o-transition: all 0.8s ease-in-out; -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out;} .bh:hover {width: 500px; height: 300px; background-image: url(http://funkyimg.com/i/2iB5j.jpg); opacity: 1.0;}</style> <center><div style="background-image: url(http://funkyimg.com/i/2iB5j.jpg); width: 500px; height: 300px;"><div class="bh"><div style="width: 200px; padding: 10px; background-color: white; position: relative; top: 100px; left: 80px; font-family: times new roman; color: 121212; font-style: italic; letter-spacing: 3px; font-size: 11px; opacity: 0.95; text-align: justify; line-height: 95%;"> <b>Имя:</b> <br> <b>Возраст:</b> <br> <b>Ориентация: </b><br> <b>Должность:</b><br> </div></div></div><div style="width: 500px; background-image: url(http://funkyimg.com/i/2iq4H.jpg); border-bottom: 40px solid #3467b8;"> <div style="width: 400px; font-family: petit formal script; color: white; font-size: 45px; padding-top: 30px; position: relative; z-index: 2;"> В поисках (кого?...) </div><div style="width: 400px; font-family: marvel; color: white; font-size: 11px; letter-spacing: 3px; text-transform: uppercase; margin-top: 12px;"> используемая внешность </div><BR><div style="width: 450px; padding-left: 10px; padding-right: 10px; background-color: white; font-family: calibri, sans-serif; color: 121212; font-size: 12px; line-height: 90%; text-align: justify; height: 300px; overflow: auto;"> <br> <b>КРАТКАЯ ИНФОРМАЦИЯ</b><hr> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse nec eros vel nisi sagittis egestas in sed eros. Nullam diam metus, ullamcorper sit amet accumsan in, porta vitae metus. Donec mauris risus, dictum quis aliquam a, pulvinar sed lorem. In hac habitasse platea dictumst. Nulla eget leo velit, vitae congue eros. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque odio enim, vulputate ac iaculis faucibus, cursus vitae diam. Aliquam erat volutpat. Donec adipiscing sollicitudin nisi quis convallis. Nulla facilisi. Nunc risus odio, consequat a ullamcorper at, sollicitudin eget est. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. <br><br> <b>Отношения</b><hr> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse nec eros vel nisi sagittis egestas in sed eros. Nullam diam metus, ullamcorper sit amet accumsan in, porta vitae metus. Donec mauris risus, dictum quis aliquam a, pulvinar sed lorem. In hac habitasse platea dictumst. Nulla eget leo velit, vitae congue eros. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque odio enim, vulputate ac iaculis faucibus, cursus vitae diam. Aliquam erat volutpat. Donec adipiscing sollicitudin nisi quis convallis. Nulla facilisi. Nunc risus odio, consequat a ullamcorper at, sollicitudin eget est. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. </div><BR><BR><BR><div style="width: 460px; padding: 20px; font-family: marvel; color: white; font-size: 12px; letter-spacing: 4px; background-color: 3467b8;"> Заметки:<br> Что хотели бы отыграть:<br> Связь с вами:<br> </div></div></center>
Код:
[code*]<!--*HTML--> <link href='http://fonts.googleapis.com/css?family=Petit+Formal+Script|Marvel' rel='stylesheet' type='text/css'><style type="text/css">.bh {width: 500px; height: 300px; background-image: url(http://funkyimg.com/i/2iB5j.jpg); opacity: 0.0; -o-transition: all 0.8s ease-in-out; -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out;} .bh:hover {width: 500px; height: 300px; background-image: url(ВАША ССЫЛКА НА ИЗОБРАЖЕНИЕ); opacity: 1.0;}</style> <center><div style="background-image: url(ВАША ССЫЛКА НА ИЗОБРАЖЕНИЕ); width: 500px; height: 300px;"><div class="bh"><div style="width: 200px; padding: 10px; background-color: white; position: relative; top: 100px; left: 80px; font-family: times new roman; color: 121212; font-style: italic; letter-spacing: 3px; font-size: 11px; opacity: 0.95; text-align: justify; line-height: 95%;"> <b>Имя:</b> <br> <b>Возраст:</b> <br> <b>Ориентация: </b><br> <b>Должность:</b><br> </div></div></div><div style="width: 500px; background-image: url(http://funkyimg.com/i/2iq4H.jpg); border-bottom: 40px solid #3467b8;"> <div style="width: 400px; font-family: petit formal script; color: white; font-size: 45px; padding-top: 30px; position: relative; z-index: 2;"> В поисках (кого?...) </div><div style="width: 400px; font-family: marvel; color: white; font-size: 11px; letter-spacing: 3px; text-transform: uppercase; margin-top: 12px;"> используемая внешность </div><BR><div style="width: 450px; padding-left: 10px; padding-right: 10px; background-color: white; font-family: calibri, sans-serif; color: 121212; font-size: 12px; line-height: 90%; text-align: justify; height: 300px; overflow: auto;"> <br> <b>КРАТКАЯ ИНФОРМАЦИЯ</b><hr> ТЕКСТ <br><br> <b>Отношения</b><hr> ТЕКСТ </div><BR><BR><BR><div style="width: 460px; padding: 20px; font-family: marvel; color: white; font-size: 12px; letter-spacing: 4px; background-color: 3467b8;"> Заметки:<br> Что хотели бы отыграть:<br> Связь с вами:<br> </div></div></center>[/code*]
Чтобы код работал, уберите *