Двойной рамкой в CSS с промежутком в середине?

Тема в разделе "Верстка", создана пользователем Ahmad, 20 сен 2013.

Информация :
Уважаемые пользователи, прежде чем ответить в теме или создать новую, внимательно ознакомьтесь с Правилами раздела и Правилами форума
Для быстрого поиска ответов на ваши вопросы воспользуйтесь Картой раздела и/или Поиском по разделу
Модераторы: ultra
  1. Ahmad

    Ahmad Постоялец

    Регистр.:
    4 май 2013
    Сообщения:
    86
    Симпатии:
    1
    Можно ли как-то создать двойной рамкой в CSS, с этими настройками 2?:

    1) Одна линия немного толще, чем другие
    2) Существует небольшой разрыв между линиями

    Пример того, что мне нужно:

    [​IMG]
     
  2. Sunday

    Sunday

    Регистр.:
    13 дек 2009
    Сообщения:
    737
    Симпатии:
    324
    Думаю, что для одного элемента такого не сделать. Что мешает использовать два элемента в HTML и для каждого прописать нужные стили?
     
  3. Ahmad

    Ahmad Постоялец

    Регистр.:
    4 май 2013
    Сообщения:
    86
    Симпатии:
    1
    У меня только один элемент, вокруг которого я могу добавить границу. Я не могу изменить HTML, чтобы добавить еще один элемент к сожалению.
     
  4. ArtyGrand

    ArtyGrand Постоялец

    Регистр.:
    6 июн 2009
    Сообщения:
    80
    Симпатии:
    37
    внезапно можно так
    box-shadow: 0 0 0 4px #000, 0 0 0 6px #fff, 0 0 0 7px #000;
     
  5. Ahmad

    Ahmad Постоялец

    Регистр.:
    4 май 2013
    Сообщения:
    86
    Симпатии:
    1
    Это работает, но есть третье условие тоже. Я только хочу, чтобы это показать на верхней стороне 'div'. Я не упомянул об этом раньше, потому что я не знаю, что вы будете использовать 'box-shadow' вместо 'border'. Я не думаю, 'box-shadow' может быть установлен только для одной стороны.
     
  6. ArtyGrand

    ArtyGrand Постоялец

    Регистр.:
    6 июн 2009
    Сообщения:
    80
    Симпатии:
    37
    ну так, блин, вставь эту картинку фоном в див.
     
  7. Ahmad

    Ahmad Постоялец

    Регистр.:
    4 май 2013
    Сообщения:
    86
    Симпатии:
    1
    Я не хочу этого делать. Там должен быть способ сделать это. :)
     
  8. ArtyGrand

    ArtyGrand Постоялец

    Регистр.:
    6 июн 2009
    Сообщения:
    80
    Симпатии:
    37
    То - не так, это - не хочу. Магия css пока не способна дотянуться до фотошопа, так что не привередничай.
    /me ушел из темы.
     
  9. mdss

    mdss ♖♘♗♕♔♗♘♖

    Moderator
    Регистр.:
    20 фев 2007
    Сообщения:
    1.134
    Симпатии:
    668
  10. asusdemo

    asusdemo Создатель

    Регистр.:
    27 фев 2013
    Сообщения:
    48
    Симпатии:
    9
    Делайте при помощи Перейти по ссылке, если требуется делать вокруг рамки

    Если хотите просто подчеркнуть, используйте графику.. К примеру если котите подчеркнуть текст, можете сделать так: <div class="test"><a href="" alt=""> <i> Текст, который подчеркиваем</i></a></div>
    в сss прописываем так:
    .test a { тут навастриваем стиль текста }
    .test a > i { тут добавляем картинку с выравниванием по низу }