2016-11-10 3 views
0

Я пытаюсь создать сайт, который использует сетевые системы bootstrap в качестве руководства, но не управляется им, до такой степени, чтобы выглядеть слишком похожим на другие веб-сайты и иметь все мои элементы либо слишком близки друг к другу, либо слишком далеко друг от друга, что имеет тенденцию происходить с самыми основными способами использования 12-ти столбцов.Элементы, изменяющие размерность, которые используют классы сетки Bootstrap

Теперь я знаю, что могу изменить количество столбцов до 16 или 24, но с тем, что у меня есть моя настройка проекта, которая будет сложной и будет по-прежнему более ограничительной, чем хотелось бы. Так что мне было интересно, если у меня есть код, подобный этому:

<div class="bean-game col-md-8"> 
    <h2>Bean Curd Mixing Area</h2> 
</div> 

без использования свойства width: CSS, или что-нибудь, что подменяет Bootstrap CSS полностью (который я заинтересован может сделать код неуправляемым другими способами) , есть ли что-нибудь, что я могу сделать с помощью CSS или, возможно, даже JavaScript или JS-библиотеки, если необходимо, чтобы сделать .bean-game div resize относительным к ширине, заданной в коде Bootstrap для класса col-md-8?

В случае веб-сайта, над которым я работаю, я хотел бы, чтобы div содержал класс col-md-8, чтобы быть просто более широкой (скажем, 10 пикселей или около того), чтобы аккуратно совместить с div над ним, который, несмотря на то, что другой класс col-md-[foo] находится за пределами обычной сетчатой ​​системы из-за незначительного обмана с контейнером div и некоторыми полями, что дало мне промежуточный эффект, который я получил после ...

Я понимаю, это может быть трудная вещь, которую нужно пытаться сделать, но на самом деле это действительно лучший способ подойти к этой конкретной проблеме.

+0

http://getbootstrap.com/customize/ - вы можете создать свой собственный! Наслаждайтесь – user2182349

+0

Да, я видел это, но это более сложное решение, чем я надеялся, и немного от ситуации с молотком на трещину, учитывая, что вариации, которые я хочу в сетчатой ​​системе, сравнительно незначительны при этот этап, и у меня есть обширная масса других работ. По крайней мере, к моему пониманию предложенного решения. То, что я, вероятно, сделаю, это изменить размер при инициализации с помощью JS, который я * думаю * должен быть возможным, хотя он не отделяет язык и не работает так, как хотелось бы, но иногда мне нужно угадать. Однако я еще раз посмотрю на настройку. И спасибо. –

ответ

0

Я изучил это, и кажется, что лучшим решением для меня в настоящее время будет использование псевдоклассов (возможно, ::after, хотя я еще не играл с ними достаточно ...), чтобы добавить псевдо- и поэтому обойти ограничения Bootstrap «на лету», без необходимости настраивать мою настройку Bootstrap (которую я предпочитаю оставлять на CDN) и не загрязнять отношения между формой и функцией, поскольку мой JavaScript выполняет операции моделирования, не связанные с пользовательский ввод. Это все еще не «идеальное» решение, но я могу использовать его как возможность ввести немного более продвинутый стиль, который, мы надеемся, принесет пользу общей эстетике страницы.

Я приму свой ответ, если это решение будет удовлетворено.

Смежные вопросы