更改基金会的菜单画布的宽度 [英] Change width of menu canvas of Foundation

问题描述

我正在使用框架基础，非常有用.
我想知道如何更改画布菜单的宽度.
使用escusicamente CSS.
谢谢

I am using the framework foundation and is very useful.
I wanted to know how you can change the width of the canvas menu.
Use escusicamente css.
Thank

推荐答案

如果您正在使用Foundation的scss版本，则就像在settings.scss文件中更改$off-canvas-width: rem-calc(250);一样容易.

If you are using the scss version of Foundation it's as easy as changing $off-canvas-width: rem-calc(250); in your settings.scss file.

如果使用的是CSS，则需要更改.left-off-canvas-menu和.move-right > .inner-wrap transform的宽度. 我建议您通过向.left-off-canvas-menu和off-canvas-wrap添加新类(如<div class="my-site off-canvas-wrap" data-offcanvas>和<div class="my-site left-off-canvas-menu>

If you are using css you need to change the width of the .left-off-canvas-menu and .move-right > .inner-wrap transform. I suggest you override specificity by adding a new class to .left-off-canvas-menu and off-canvas-wrap, something like <div class="my-site off-canvas-wrap" data-offcanvas> and <div class="my-site left-off-canvas-menu>

然后是CSS:

.my-site.move-right > .inner-wrap {
    webkit-transform: translate3d(newwidth, 0, 0);
    -moz-transform: translate3d(newwidth, 0, 0);
    -ms-transform: translate3d(newwidth, 0, 0);
    -o-transform: translate3d(newwidth, 0, 0);
    transform: translate3d(newwidth, 0, 0);
}

和

.my-site.left-off-canvas-menu {
    width: newwidth;
}

这篇关于更改基金会的菜单画布的宽度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！