Стилизиране на блок

Безплатни 20 урока
регистрирай се и научи

Ако сте вече потребител - Регистриран съм
Видео

Въпроси и отговори

  • Защо CSS правилото url(img/im01.jpg), url(img/im02.jpg), зададено във външен файл не работи

    Живко Казаков:

    Правилата background-image: url(img/im01.jpg), url(img/im02.jpg) и background-repeat: no-repeat, repeat-y;, зададени във външният файл style.css не работят при мен. Същите правила, зададени със style атрибута в div тагът, работят съвсем коректно.

    <

    div id="block_id" style="background-image: url(img/im01.jpg), url(img/im02.jpg); background-repeat: no-repeat, repeat-y;">

    Всички останали правила, които съм задал за idто block_id във файлът style.css, като фон, размери и т.н., също си работятсъвсем коректно.

    На какво може да се дължи това? От 3те наина на задаване на CSS правила, този с атрибутът style е с най-висок приоритет, но едва ли това е причината.

    Грациела Георгиева:

    Здравей, Вероятно точно това в причината. Високият приоритет на остиляването директно в style атрибута на даден таг е причината да не работят същите неща, но написани във външен файл. Kогато пишеш във външен файл остиляване за #block_id, в един таг ли слагаш всички свойства със стойностите? А и няма кавички, може да опиташ да сложиш. И защо има две url-та? Задай го по този начин. Пример:

    #block_id {
    background: #00ff00 url("smiley.gif") no-repeat fixed center; 
    }
    
    Живко Казаков:

    Това с няколкото url-а не го знаех. В урокът дават пример даже с 3 (след 6:15 накъде). Ползвам или едното или другото. Първоначално ги сложих във външният файл, в правилата за #block_id, като в

    <

    div> тагът имаше само зададено id.

    <div id="block_id"></div>
    

    (В този пример е само с 1 url.)

    В другият вариант правилата за картинка за фон и позиционирането съм ги преместил в style тагът в div.

    <div id="block_id" style="background-image: url(img/im1.jpg); background-repeat: no-repeat;">
    </div>
    

    и съм ги изтрил от Stylizer:

    Опитах с кавики - не е това причината. Премахнах нулата от името на картинката, да не би да съм напсал главно О вместо 0, но и това не е. Впрочем, със style в div тагът си работи прекрасно, но искам да разбера, дали причината е в мен - нещо да съм конфигурирал неправилно. Друга възможна причина може да е, че Stylizer тези дни се ъпдейтна и може в тази актуализация да е причината.

    Грациела Георгиева:

    В първия случай името на изображението е с голяма буква (Im1.jpg), а във втория - с малка (im1.jpg). Вероятно това е грешката, опитай да го поправиш и пробвай отново по двата начина. :)

    Живко Казаков:

    :) Гледах спецално да не се полчи това, но се е случило. Не е това проблемът, обаче. Предположих, че причината може да е в конфликт, който се получва с правила, зададени в други външни файлове и закоментирах линковете към всички такива - не се получи. Ще създам нов html само с 1 div таг и пробвам с него. Впрочем, за HTML аз ползвам phpDesigner 8. Възможно е той да вмъква някакъв код. Освен това HTML файловете ми започват с:

    Възможно е и причината да е в xhtml форматирането и затова и тези тагове ще ги изчистя максимално.

    Грациела Георгиева:

    Аз използвам Notepad++ и когато му се добавят някои plug-in-и, както и като се направят някои настройки, работи доста добре. Достатъчно простичък е интерфейсът на ID-то. :)) Премахни всякакво остиляване и опитай само това, което си написал по-рано отново по двата начина.

    Живко Казаков:

    Получи се :) Причината се оказа в пътят към картинките. Тябва да се напише целият.

    Ето го и предишният вариант:

    Причината е единствено в пътят към картинките - трябва да бъде указан пълният път. Впрочем ползвам xampp и вероятно от там идва това изискване.

    Грациела Георгиева:

    Радвам се, че се е получило. Вероятно просто картинакта не е била в същата папка, в която е кодът. :))