Рубрика: Верстка

Обычно шрифты подключаются из fonts.google.com. Однако, часто в PSD макетах для верстки используются шрифты, отсутствующие там. В таком случае приходится искать шрифты в других местах и скачивать архив с ними.  Для подключения новых шрифтов в файле стилей необходимо прописать следующее:

@font-face {
  font-family: 'AvenirNextCyr-Bold';
  src: url('../fonts/AvenirNextCyr-Bold.eot');
  src: url('../fonts/AvenirNextCyr-Bold.eot#iefix') format('embedded-opentype'), url('../fonts/AvenirNextCyr-Bold.woff') format('woff'), url('../fonts/AvenirNextCyr-Bold.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

 

Необходимо, чтобы при наведении мыши на картинку, она увеличивалась. Сделать это можно с помощью следующего css кода:

img:hover{
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform:scale(1.1) ;
  -o-transform: scale(1.1);
  transform:scale(1.1) ;
}

 

Очень часто заказчик хочет чтобы его сайт выглядел красиво и эффектно и при этом сам не знает как. В таком случае можно посмотреть примеры оформления на следующем сайте: atuin.ru/blog/

Там можно найти  красивое и нестандартное оформление:

• Списков
• Таблиц
• Иконок
• Видео
• И многое другое

Скопировать код в верстку очень просто, html код добавляется на страницу, а css свойства дописываются в файл стилей.