2016-04-24 3 views
-1

Я хочу изменить стиль бокового меню, но после нескольких изменений в onsen-css-components-blue-basic-theme.css Я не могу найти элемент, содержащий тень края (см. ниже изображения). Я хочу удалить тень из меню - какой файл обрабатывается?Изменение стиля меню в Onsen

<ons-sliding-menu var="menu" id="menusliding" main-page="main.html" menu-page="menux.html" max-slide-distance="85%" type="reveal" side="left" ></ons-sliding-menu> 

enter image description here

ответ

0

Вообще это лучшая идея не трогать сгенерированные файлы, как если бы в какой-то момент вы решили изменить тему или обновить версию изменения будут перекрываться. Поэтому вместо того, чтобы пытаться изменить фреймворк css, лучше, если вы просто напишете свои стили в отдельном файле (по крайней мере, пока вы не решите подтолкнуть вещи к производству).

А насчет вопроса: эти вещи можно найти, выполнив right click => inspect element. Если вы сделаете это на элементе, вы сможете увидеть, откуда взялись стили. То, как вы формулируете свой вопрос, кажется, что вы пытались его найти, но не смогли. Вероятно, если бы вы долго смотрели, вы бы смогли его найти.

После выполнения описанного выше метода я смог найти, что на самом деле он определен в element.style основного содержимого. Некоторые библиотеки делают такие вещи, даже если это не очень рекомендуется, но это самый безопасный способ гарантировать, что стиль будет применен. Чтобы удалить его, вы можете просто сделать.

.onsen-sliding-menu__main { 
    box-shadow:none !important; 
} 

Demo

Класс может варьироваться в зависимости от версии онсэн. Это не самое элегантное решение, но ons-sliding-menu - относительно старый компонент. В Onsen 2 фактически есть элемент ons-splitter, который сочетает в себе поведение ons-sliding-menu и ons-split-view. Если вы используете это, вы увидите, что тень там была удалена.

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