Картинка под посещённой ссылкой

Discussion in 'CSS, HTML, Web 2.0, верстка по web-стандартам' started by nataly_, Oct 28, 2009.

  1. Offline

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

    Joined:
    Sep 23, 2009
    Messages:
    41
    Likes Received:
    0
    Gender:
    Female
    Подскажите пожалуйста как можно сделать через css , чтобы под посещённой ссылкой была картинка размера как текст ссылки со скруглёнными справа и слева краями как во вложении или это невозможно?
     

    Attached Files:

    nataly_, Oct 28, 2009
    #1

  2. Ads Master

     
  3. OlegM
    Offline

    OlegM Russian Joomla! Team Staff Member

    Joined:
    Apr 12, 2007
    Messages:
    4,310
    Likes Received:
    375
    Gender:
    Male
    Мало что понял из-за отсутствия пунктуации, но попробуй использовать псевдоселектор :visited
     
    OlegM, Oct 28, 2009
    #2
  4. Offline

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

    Joined:
    Sep 23, 2009
    Messages:
    41
    Likes Received:
    0
    Gender:
    Female
    Это понятно что visited естественно, я мела ввиду как сделать картинку такого же размера как текст, если количество текста не известно.
    Я так думаю что под тектом используется одинаковая фоновая картинка, а слева и справа добавляются блоки скруглённых краев, а как их добавить через ксс никак не могу придумать, вобщем делаю под джумлу меню как на картинке
     
    nataly_, Oct 28, 2009
    #3
  5. OlegM
    Offline

    OlegM Russian Joomla! Team Staff Member

    Joined:
    Apr 12, 2007
    Messages:
    4,310
    Likes Received:
    375
    Gender:
    Male
    Делишь картинку на 2. Если A в LI, то у LI фон - широкая картинка с округлостью слева, у A фон - узкая картинка с округлостью справа. Будет наложение.
    + CSS-свойство width:auto

    Вообще, ликбез по CSS - это как бы не сюда...
     
    OlegM, Oct 28, 2009
    #4
  6. Offline

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

    Joined:
    Sep 23, 2009
    Messages:
    41
    Likes Received:
    0
    Gender:
    Female
    Спасибо, интересный способ, но

    у меня выбрано в joomle в свойствах модуля горизантальное меню, на li никак не реагирует(Хотя вертикальное реагировало)
    Видимо сделано как-то без li. Стиль задаю просто как стиль ссылки текущего дива, как быть в этом случае?
     
    nataly_, Oct 28, 2009
    #5
  7. OlegM
    Offline

    OlegM Russian Joomla! Team Staff Member

    Joined:
    Apr 12, 2007
    Messages:
    4,310
    Likes Received:
    375
    Gender:
    Male
    Давай не будем гадать. Есть исходник страницы и всякие инструменты типа Firebug, помогающие проанализировать код.
    А метод научного тыка не всегда полезен и использование css наугад - пустая трата времени.

    Как я говорил про LI и A - сделать не получится, вернее - получится, но внутри А должен быть какой-нибудь тег, например span. В стандартном меню такое получится, если использовать стиль "Список". Тогда код будет что надо:
    Код (html):
    1. <li class="item28"><a href="/testcore/joomru/about-joomla"><span>О Joomla!</span></a></li>


    А сделать список горизонтальным - дело техники.
     
    OlegM, Oct 29, 2009
    #6
  8. Offline

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

    Joined:
    Sep 23, 2009
    Messages:
    41
    Likes Received:
    0
    Gender:
    Female
    а как не подскажите, у меня так и не получилось((
     
    nataly_, Oct 29, 2009
    #7
  9. OlegM
    Offline

    OlegM Russian Joomla! Team Staff Member

    Joined:
    Apr 12, 2007
    Messages:
    4,310
    Likes Received:
    375
    Gender:
    Male
    Как-то так
    Код (CODE):
    1. ul.menu-nav li {float:left}
     
    OlegM, Oct 29, 2009
    #8
  10. Offline

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

    Joined:
    Sep 23, 2009
    Messages:
    41
    Likes Received:
    0
    Gender:
    Female
    То есть выбираю в свойствах меню - список,
    в index.php пишу класс в котором находится меню class="menu1"
    в template.css пишу ul.menu1 li {float:left}?

    Не помогает((
     
    nataly_, Oct 29, 2009
    #9
  11. Offline

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

    Joined:
    Sep 23, 2009
    Messages:
    41
    Likes Received:
    0
    Gender:
    Female
    Спасибо , получилось когда сделала вот так:

    .menu1 ul,li {
    float:left;

    }
     
    nataly_, Oct 29, 2009
    #10
< Оформление заголовка | как разбить заголовок статьи на 2 строки? >

Share This Page

Loading...