» »

Переключатели страниц в красном для uCoz


Переключатели страниц в красном для uCoz

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

Установка:

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

Код
.catPages1 {color:#FF0000;border:0px;margin-bottom:0px;margin-top:10px;font-family:Georgia, "Times New Roman", Times, serif;text-align:center;}  
  .catPages1 a:link,  
  .catPages1 a:visited {color:#fff;text-decoration:none;background:#FF0000;padding:2px 10px;font-size:9pt;}  
  .catPages1 a:hover {background-color:#FF0000;}  
  .catPages1 b {text-decoration:none;background:#FF0000;padding:4px 11px;color:#fff;font-size:12pt;position:relative;bottom:-1.5pt;}  
  .catPages1 b,  
  .catPages1 a {-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px;}  
  .pagesBlockuz2 {color:#FF0000;border:0px;margin-bottom:0px;margin-top:10px;font-family:Georgia, "Times New Roman", Times, serif;text-align:center;}  
  .pagesBlockuz2 a:link,  
  .pagesBlockuz2 a:visited {color:#fff;text-decoration:none;background: #6B0A0A;padding: 5px 11px;font-size: 9pt;}  
  .pagesBlockuz2 a:hover {background-color:#FF0000;}  
  .pagesBlockuz2 b {text-decoration:none;background:#FF0000;padding:5px 12px;color:#fff;font-size:12pt;position:relative;bottom:-1.5pt;}  
  .pagesBlockuz2 b,  
  .pagesBlockuz2 a {-moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;}  
  .pagesBlockuz1 {color:#FF0000;border:0px;margin-bottom:0px;margin-top:10px;font-family:Georgia, "Times New Roman", Times, serif;text-align:center;}  
  .pagesBlockuz1 a:link,  
  .pagesBlockuz1 a:visited {color:#fff;text-decoration:none;background:#340202;padding:3px 10px;font-size:9pt;}  
  .pagesBlockuz1 a:hover {background-color:#FF0000;}  
  .pagesBlockuz1 b {text-decoration:none;background:#FF0000;padding:4px 11px;color:#fff;font-size:12pt;position:relative;bottom:-1.5pt;}  
  .pagesBlockuz1 b,  
  .pagesBlockuz1 a {-moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;}  
  .pagesBlock1 {color:#FF0000;border:0px;margin-bottom:0px;margin-top:10px;font-family:Georgia, "Times New Roman", Times, serif;text-align:center;}  
  .pagesBlock1 a:link,  
  .pagesBlock1 a:visited {color:#fff;text-decoration:none;background:#FF0000;padding:3px 10px;font-size:9pt;}  
  .pagesBlock1 a:hover {background-color:#FF0000;}  
  .pagesBlock1 b {text-decoration:none;background:#FF0000;padding:4px 11px;color:#fff;font-size:12pt;position:relative;bottom:-1.5pt;}  
  .pagesBlock1 b,  
  .pagesBlock1 a {-moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;}


Что то если не оттенку не сильно подходит, то вы можете довести как вам видеться.
25.01.2016 Просмотров: 535 Комментарий: (5)

Поделиться в социальных сетях

Материал разместил

Комментарий: 5
kredit-oformi
kredit-oformi 25.01.2016 07:351
0
Знакомый переключатель в красном цвете smile рад что не зря перекрашивал biggrin wink
Kosten
Kosten 25.01.2016 12:122
0
kredit-oformi, немного совсем изменил один оттенок и сделал на пару пикселей шире.
kredit-oformi
kredit-oformi 25.01.2016 12:373
0
kosten, обратил внимание и правильно такой вариант тоже не дурно смотрится
Kosten
Kosten 25.01.2016 12:404
0
Он темный идет, и верхние кнопки бы убрал, не то что у этого дизайна кнопок, можно сказать у всех.
Maryges
Maryges 25.01.2016 15:565
0
Всегда найдется тот сайт, где эти переключатели будут подходить к нему.
avatar