блок без рамки со скругленными углами

Тема в разделе "Ошибки при работе с Joomla", создана пользователем Игооо, 27.06.2011.

  1. Offline

    Игооо Недавно здесь

    Регистрация:
    06.05.2011
    Сообщения:
    121
    Симпатии:
    4
    Пол:
    Мужской
    Помогите разобраться с блоком. Я в писал в CSS
    div.module {
    position:relative;
    border:1px solid #999999;/*Граница под цвет закругленных углов*/
    width:100%;/*Ширина бокса обязательно только для ie6, для нормальных браузеров можно не ставить. Или же ставим нужную вам.*/
    }

    div.module div {
    padding:10px;/* Отступ контента, желательно не меньше чем радиус закругленного блока*/
    }

    div.module .tl {
    background:url(images/round.png) 0 0 no-repeat;/*путь к картинке - у каждого свой*/
    width:10px; height:10px;
    top:-1px;
    left:-1px;
    position:absolute;
    }

    div.module .tr {
    background:url(images/round.png) 100% 0 no-repeat; /*путь к картинке - у каждого свой*/
    width:10px; height:10px;
    top:-1px;
    right:-1px;
    position:absolute;
    }

    div.module .bl {
    background:url(images/round.png) 0 100% no-repeat; /*путь к картинке - у каждого свой*/
    width:10px; height:10px;
    bottom:-1px;
    left:-1px;
    position:absolute;
    }

    div.module .br {
    background:url(images/round.png) 100% 100% no-repeat; /*путь к картинке - у каждого свой*/
    width:10px; height:10px;
    bottom:-1px;
    right:-1px;
    position:absolute;
    }
    Появляется блок, все работает но только углы прямые
    в HTML вписал

    <div class="module">
    <span class="tl"></span>
    <span class="tr"></span>
    <div>
    Module content
    </div>
    <span class="bl"></span>
    <span class="br"></span>
    </div> источник информации http://www.master-web.info/joomla-rounded-corners-modify/
    что не так или что то не хватает?
     
  2.  
  3. Offline

    Al_ Недавно здесь

    Регистрация:
    27.06.2011
    Сообщения:
    17
    Симпатии:
    2
    Пол:
    Мужской
    Если Вас правильно понял, У Вас не прописаны радиусы, нужно вписать подобное.
    {
    Width:100px;
    Height:100px;
    border-radius:6px;
    -webkit-border-radius:6px;
    -moz-border-radius:5px;
    -khtml-border-radius:10px;
    }
    Прошу не пинать меня ногами, я только учусь.с|:)
     
  4. Offline

    Игооо Недавно здесь

    Регистрация:
    06.05.2011
    Сообщения:
    121
    Симпатии:
    4
    Пол:
    Мужской
    сейчас попробую. везде прописать или где то конкретно?
     
  5. Offline

    Игооо Недавно здесь

    Регистрация:
    06.05.2011
    Сообщения:
    121
    Симпатии:
    4
    Пол:
    Мужской
    Походу получилось:) вписал вот так

    div.module {
    position:relative;
    border:1px solid #FFDAB9;
    width:15%;
    border-radius;
    -webkit-border-radius:6px;
    -moz-border-radius:5px;
    -khtml-border-radius:10px;
    background: #FFDAB9

    Спасибо!
     
  6. Offline

    Игооо Недавно здесь

    Регистрация:
    06.05.2011
    Сообщения:
    121
    Симпатии:
    4
    Пол:
    Мужской
    А может Вы знаете что нужно прописать для эффекта? Например чтоб подсвечивалась немного.
     
  7. Offline

    Al_ Недавно здесь

    Регистрация:
    27.06.2011
    Сообщения:
    17
    Симпатии:
    2
    Пол:
    Мужской
    Если подсвечивать ссылку то что-то подобное в CSS: a:hover {color: red; mso-bidi-font-size:12pt}
     

Поделиться этой страницей

Загрузка...