Пущенное в ход изображение налево от ул. игнорирует поле/дополнение

вы должны увидеть этот блог , чтобы установить nodejs с менеджером пакетов

Перед выполнением этой команды. вы показываете прогон sudo apt-get update, убедитесь, что результат Чтение списков пакетов ... Готово , нет ОШИБКИ

Шаг за шагом (Debian):

sudo apt-get update

установить 6_x

curl -sL https://deb.nodesource.com/setup_6.x | sudo -E bash -
sudo apt-get install -y nodejs

установить 7_x

curl -sL https://deb.nodesource.com/setup_7.x | sudo -E bash -
sudo apt-get install -y nodejs

11
задан caitlin 7 May 2010 в 20:21
поделиться

3 ответа

Добавьте это:

ul{ list-style-position: inside}

Вот и все!

8
ответ дан 3 December 2019 в 02:52
поделиться

Вы можете присвоить элементам списка свойство переполнения:

li {
    overflow: hidden;
}

Это приведет к тому, что элемент списка будет вести себя правильно: они будут отображаться как квадратный блок, продолжающийся там, где заканчивается изображение. , они не плавно текут влево. Следующим элементом списка будет.

0
ответ дан 3 December 2019 в 02:52
поделиться

Если вы не беспокоитесь о добавлении javascript, вот сценарий jQuery, который добавит поле к ul, которое перекрывает изображение, чтобы все элементы списка оставались выровненными, а затем присваивает отрицательный маржа к li, которая не перекрывается.

$(function(){
    //Define a context so we only move lists inside a specified parent
    var context = $("#test_div");    

    //Build a list of images position a size
    var imgRects = [];
    var imgs = $("img.left", context);
    imgs.each(function(i){
        var pos = $(this).position();
        pos.right = pos.left + $(this).outerWidth(true);
        pos.bottom = pos.top + $(this).outerHeight(true);
        imgRects.push(pos);        
    });

    //Process each li to see if it is at the same height of an image        
    var lis = $("li", context);
    lis.each(function(i){
        var li = $(this);
        if(li.parent().css('marginLeft') != "0px"){
            return; //Already moved
        }
        var top = li.position().top;
        for(var j in imgRects){
            var rect = imgRects[j];
            if(top > rect.top && top < rect.bottom){
                li.parent().css('marginLeft', rect.right);
                return;
            } else if(li.parent().css('marginLeft') != "0px"){
                li.css('marginLeft', -1 * rect.right);
            }
        }
    });
});

Я тестировал вашу демонстрационную страницу и jQuery 1.3.2, и он работает в FF3.5 и IE8, потому что изображение находится поверх документа. Если изображение появляется в середине ul, первые li останутся заполненными. Если вам нужно исправить эту проблему, оставьте комментарий, и мы попробуем обновить скрипт.

0
ответ дан 3 December 2019 в 02:52
поделиться
Другие вопросы по тегам:

Похожие вопросы: