Кодинг
★ Рубрика: Кодинг
★ Тема: CSS

Симпатичная сетка - css

Для вашего сайта может понадобиться сделать сетку. Например, такую как вы видите ниже. Чаще всего такие сетки используют на учебных сайтах.
Текст на сетке
Для создания такой сетки понадобится css-код:
.graph
{
 background-color: #FFFFFF;
 background-image: 
 linear-gradient(0deg, transparent, transparent 99px, #B0B0B0 99px, #B0B0B0 99px), 
 linear-gradient(90deg, transparent, transparent 99px, #B0B0B0 99px, #B0B0B0 99px), 
 linear-gradient(0deg, transparent, transparent 49px, #D0D0D0 49px, #D0D0D0 49px), 
 linear-gradient(90deg, transparent, transparent 49px, #D0D0D0 49px, #D0D0D0 49px), 
 
 linear-gradient(0deg, transparent, transparent 9px, #EAEAEA 9px, #EAEAEA 9px),
 linear-gradient(90deg, transparent, transparent 9px, #EAEAEA 9px, #EAEAEA 9px);
 background-size: 100px 100px, 100px 100px, 50px 50px, 50px 50px, 10px 10px, 10px 10px;
 
 border: 1px solid #555555;
 -webkit-filter:drop-shadow(0px 0px 25px rgba(0, 0, 0, 0.7));

 width: 80%;
height:300px;
left:10%;
top:20px;
 position: relative;
}
И контейнер:
 Похожие публикации: CSS

Войдите, чтобы добавить Ваш ответ. [ Регистрация | Вход ]