• Страница 1 из 1
  • 1
5 простых способов в реализаций CSS на сайте
Kosten
Воскресенье, 13 Января 2019, 02:28 | Сообщение 1
Оффлайн
Администраторы
Сообщений:44490
Награды: 70
Вашему вниманию интересные трюки, которые вы можете воплотить на своем сайте, где очень простые эффекты, где всегда пригодятся при создание интернет портала. Стили CSS, или просто каскадные таблицы стилей, это новая веб-технология, которая дает веб-разработчикам расширенный контроль, как в оформление страницы или полного сайта, так и внешний вид вновь созданного элемента страницы.

Так как вещи, которые когда-то считались неизменными, такие как подчеркивание под ссылками, цвет элементов формы, расстояние между текстом и многое другое, теперь могут быть кардинально изменены, благодаря CSS. В этой статье показано 5 самых распространенных эффектов, которые созданы на CSS.

1. Подчеркнутые ссылки

Одним из первых индикаторов появления CSS стало то, что люди, просматривающие в сети интернет, начали сообщать о странных явлениях среди некоторых сайтов, к которым они обращались. Текстовые ссылки на этих сайтах не были подчеркнуты. Теперь мы знаем, что это вызвано CSS, и ниже приведен код, который вы можете использовать для достижения того же эффекта.

CSS

Код
<style type="text/css">
a{
text-decoration:none;
}
</style>


К счастью или к сожалению, все текстовые ссылки на вашей странице больше не подчеркнуты.

2. Перенос текстовых ссылок

С огромной популярностью, связанной с эффектами смены изображений, неудивительно, что я получаю много писем с вопросом, как создать этот эффект, который создает перенос текстовых ссылок. Где также позволяет легко придать текстовым ссылкам индивидуальность, это изменить цвет при наведении.

CSS

Код
<style type="text/css">
a:hover{
color:red;
}
</style>


Как и первый код, вышеприведенный код должен быть вставлен в заголовочный раздел вашей страницы. Вы можете изменить ключевое слово "красный" по своему вкусу.

3. Фоновое изображение для элементов блока

Если вам нравится создавать фоновые изображение, то этот эффект для вас. Используя CSS, вы можете теперь дать любому элементу блока фоновое изображение. Элемент блока просто ссылается на элементы, которые определяют прямоугольную область.

Такие элементы, как font и span, НЕ являются блочными элементами, для того, чтобы придать элементам блока фоновое изображение, просто вставьте приведенный ниже код CSS в тег элемента

CSS

Код
<div style="background-image:url('Ссылка на изображение')">.....</div>


На этом все.

4. Выделить текст

Вероятно многие сталкивались, когда нужно в статье выделить ключевые слова в красивом силе, это просто называется текстом с цветом фона. Это позволяет привлечь внимание к конкретному тексту, придав ему цвет фона.

CSS

Код
<span style = "background-color: yellow">ZorNet - портал для вебмастера</ span>


Как видите, просто деформируйте текст, который вы хотите выделить, с помощью части, выделенной жирным шрифтом.

5. Необычные границы для обвода

Еще одна хитрость CSS для быстрого создание границ таблицы к описанию ключевого слова. Вышеуказанный эффект достигается с помощью следующего кода

В стиле CSS прописываем:

Код
style = "border: 2px solid green"


Где самостоятельно изменяем «2px» и «green» на разные значения, чтобы изменить толщину и цвет границы соответственно.
Страна: (RU)
  • Страница 1 из 1
  • 1
Поиск: