Кнопка CSS и её вывод

9 года 5 мес. назад #6621 от Иван
Всем привет! Скажите пожалуйста как вывести кнопку на сайт в определенный модуль?
Я сгенерировал кнопку вот её CSS-код
.button {
   border-top: 1px solid #fafdff;
   background: #ba0028;
   background: -webkit-gradient(linear, left top, left bottom, from(#bf000a), to(#ba0028));
   background: -webkit-linear-gradient(top, #bf000a, #ba0028);
   background: -moz-linear-gradient(top, #bf000a, #ba0028);
   background: -ms-linear-gradient(top, #bf000a, #ba0028);
   background: -o-linear-gradient(top, #bf000a, #ba0028);
   padding: 20px 40px;
   -webkit-border-radius: 17px;
   -moz-border-radius: 17px;
   border-radius: 17px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: white;
   font-size: 24px;
   font-family: Georgia, Serif;
   text-decoration: none;
   vertical-align: middle;
   }
.button:hover {
   border-top-color: #1d7099;
   background: #1d7099;
   color: #ccc;
   }
.button:active {
   border-top-color: #dfeaf2;
   background: #dfeaf2;
   }
НЕ могу вывести её и указать ссылку перехода на ней, помогите пожалуйста!

Пожалуйста Войдите или Зарегистрируйтесь, чтобы присоединиться к беседе.

9 года 5 мес. назад #6623 от Wedal
Иван, вы сгенерировали оформление кнопки, но нужна еще ее структура в html.
Для того, чтобы вставить кнопку в модуль, нужно:
1) Переопределить макет модуля в используемый шаблон Joomla(о том, как это сделать: wedal.ru/uroki-joomla/joomla-17-layouts.html ).
2) В переопределенном файле макета добавить html-код кнопки. Если эта кнопка является просто ссылкой, то можно так:
<a class="button" href="go.html">Перейти</a>
Но поскольку a - строчный элемент, нужно в CSS сделать его блоковым и задать размеры. К примеру
.button{
display:block;
width:100px;
height:30px
}
Еще не советую использовать класс button. Обычно он по умолчанию добавляется ко всем кнопкам на сайте. Соответственно, ваши стили также применятся ко всем кнопкам. Лучше используйте класс mybutton или вроде того.

Пожалуйста Войдите или Зарегистрируйтесь, чтобы присоединиться к беседе.