Как скрыть текст при помощи стилей CSS
 | |
| Красивое и интересное решение на функцию скрытие текста и все работает на стилях без JS. При наведение клика появляется полный текст. Где можно его использовать? Это все зависит от веб мастера, можно поставить в сам материал, только изначально выставить "Панель HTML кодов" так как только на HTML работать будет. Возможно и на BB кодах, но здесь не проверял. Не стал делать демонстрацию, так как вы сами все можете проверить, поставив его в материал и сохранить. Что увидите красивый эффект, здесь хочется подчеркнуть, что в стили вы сами можете поставить свое изображение, что ниже стиль приведу. Если говорить по поисковой системе, так как по умолчанию будет видна только шапка, которую можно под h1, h1, h3, поставить и первые три строки видны. Но как только наведете, то красиво развернется остальное, это может быть как статья или мануал, все что хотите спрятать. Это вот видите, что можно поставить его в материал, это файлы или блог и другие, кроме форума.  Так будет по умолчанию, но здесь вы можете сами настроить.  Здесь уже навели клик и все описание раскрылось, если убрать, то автоматически закроется, что есть плюс, место много не будет занимать.  Этот стиль выводит картинку и на ней будет описание или знаки написаны. Код background: #222 url(http://zornet.ru/Aben/ABGEA/E2Kinre_hRM.jpg) 50% 50%/cover; HTML - что выставлено по центру: Код <div class="content"> <h1>Скрытый текст</h1> <p>Здесь как раз будет ваша статья и описание, что когда установите на сайт, то шрифт автоматически увеличиться, что можно под какой то материал установить и будет смотрется оригинально и для пользователя понятно.</p> </div> Остались стили, что нажимаем на кнопку СКАЧАТЬ и откроется окно, где копируем. Они идкт уже под style, что можете сначало описание поставить и ниже уже стили. Код <style type="text/css"> стили </style> Если вы решили во многие статьи и материалы ставить этот эффект, то убираем их и прописываем в CSS сайта, что можно в самый низ. И после этого, вы уже только ставите описание и все будет работать. | |
Поделиться в социальных сетях
Материал разместил
| Комментарии: 2 | |
|
| |
