+7 (911) 913-40---
menu
person
[ Обновленные темы · Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Меняется картинка на текст
artnovДата: Суббота, 16.03.2013, 19:11 | Сообщение # 1
Начальник сайта
Группа: Администраторы
Сообщений: 151
Награды: 0
Репутация: 0
Статус: Offline
Меняется картинка на текст при наведении

Код
<style>
        body {
            font-family: Arial, Helvetica, sans-serif;
            font-size: 12px;
        }
        .boxy {
position: relative;
            width: 238px;
            height: 238px;
            overflow: hidden;
        }
        .boxy-img {
            position: absolute;
            top: 0px;
            -webkit-transition: all 300ms linear;
            -moz-transition: all 300ms linear;
            -ms-transition: all 300ms linear;
            -o-transition: all 300ms linear;
            transition: all 300ms linear;
        }
        .boxy:hover .boxy-img {
            position: absolute;
            top: 238px;
            opacity: 0;
        }
        .boxy-title {
            font-weight: bold;
            text-decoration: none;
            color: #00e000;
            font-size: 14px;
        }
        .boxy-more {
            background: #4fb9e6;
            display: block;
            padding: 5px;
            color: white;
            text-decoration: none;
            width: 50px;
            text-align: center;
            border: 1px solid #eee;
        }
        </style>
</head>
<body>
        <div class="boxy">
            <img src="http://www.novickiy.ru/otkrkartinki/gol.jpg" alt="Голландские пейзажи " class="boxy-img" />
            <a href="http://artnov.ucoz.com/photo/1" class="boxy-title">Голландские пейзажи </a>
            <p> Голландские пейзажи     
       Голландские пейзажи украсят любой интеръер, подчеркивая особый стиль помещения. На XVII век приходится расцвет голландской живописи, наиболее распространенным из которых становится пейзаж. …</p>
            <a href="http://artnov.ucoz.com/photo/1" class="boxy-more">Далее</a>
        </div>


Artnov
 
  • Страница 1 из 1
  • 1
Поиск: