草庐IT

menu_position

全部标签

html - 如何在 Flexbox 对齐的侧边栏上模拟 'position:fixed' 行为

因为已经回答了(HowcanIhaveaposition:fixed;behaviourforaflexboxsizedelement?),绝对/固定定位的盒子被从Flexbox对齐元素的正常流中取出。但是我怎样才能至少模拟position:fixed行为,比如width:300px;高度:100vw元素?这是一个初始布局演示(http://codepen.io/anon/pen/ZGmmzR),左边是侧边栏,右边是内容block。我希望nav像position:fixed元素一样跟随用户滚动页面。我知道没有Flexbox怎么办。首先,我会考虑不使用JavaScript的纯CSS解决方

html - 如何在 Flexbox 对齐的侧边栏上模拟 'position:fixed' 行为

因为已经回答了(HowcanIhaveaposition:fixed;behaviourforaflexboxsizedelement?),绝对/固定定位的盒子被从Flexbox对齐元素的正常流中取出。但是我怎样才能至少模拟position:fixed行为,比如width:300px;高度:100vw元素?这是一个初始布局演示(http://codepen.io/anon/pen/ZGmmzR),左边是侧边栏,右边是内容block。我希望nav像position:fixed元素一样跟随用户滚动页面。我知道没有Flexbox怎么办。首先,我会考虑不使用JavaScript的纯CSS解决方

html - 为什么 "position: absolute; left: 0; right: 0; width: XYpx; margin: 0 auto"实际上居中?

我在CSS方面非常精通,但今天我偶然发现了一个让我头疼的片段(here和here)。我从没想过可以通过margin:0auto将绝对定位的元素居中,但考虑到所讨论的元素具有设置的宽度并且有left:0和对:0,它实际上似乎有效:#parent{background:#999;height:300px;position:relative;width:300px;}#child{background:#333;height:50px;left:0;margin:0auto;position:absolute;right:0;width:50px;}(JSFiddle)我一直认为left:0

html - 为什么 "position: absolute; left: 0; right: 0; width: XYpx; margin: 0 auto"实际上居中?

我在CSS方面非常精通,但今天我偶然发现了一个让我头疼的片段(here和here)。我从没想过可以通过margin:0auto将绝对定位的元素居中,但考虑到所讨论的元素具有设置的宽度并且有left:0和对:0,它实际上似乎有效:#parent{background:#999;height:300px;position:relative;width:300px;}#child{background:#333;height:50px;left:0;margin:0auto;position:absolute;right:0;width:50px;}(JSFiddle)我一直认为left:0

html - 为什么 `ul` 具有 ARIA 角色 `menu` 但 `menuitem` 被禁止用于 `li` ?

刚刚涵盖了关于ARIAroles的一些策略规范.为什么ul具有ARIA角色menu但menuitem对li是禁止的?我想使用ul、li和HTML5的nav元素结合ARIA角色navigation来描述一个导航栏、菜单和菜单项。ARIArolebug?example.comW3'sHTML5validator在这里唠叨我:Badvaluemenuitemforattributeroleonelementli. 最佳答案 Jukka是incorrecthere.W3Cvalidator不检查WHATWGLS,而是检查W3CHTMLspe

html - 为什么 `ul` 具有 ARIA 角色 `menu` 但 `menuitem` 被禁止用于 `li` ?

刚刚涵盖了关于ARIAroles的一些策略规范.为什么ul具有ARIA角色menu但menuitem对li是禁止的?我想使用ul、li和HTML5的nav元素结合ARIA角色navigation来描述一个导航栏、菜单和菜单项。ARIArolebug?example.comW3'sHTML5validator在这里唠叨我:Badvaluemenuitemforattributeroleonelementli. 最佳答案 Jukka是incorrecthere.W3Cvalidator不检查WHATWGLS,而是检查W3CHTMLspe

javascript - 推特 Bootstrap : How to achieve an always-collapsed navbar dropdown menu?

我在TwitterBootstrap中使用Navbar组件http://getbootstrap.com/components/#navbar我的目标是让导航栏始终折叠(即使在桌面大小的设备上查看时也是如此)。如何做到这一点?我创建了这个JSFIDDLE到目前为止我的代码-你会发现它是非常标准的。当结果窗口的尺寸较小时,下拉菜单会折叠。但是,如果您放大结果窗口,则下拉菜单不会折叠。我已经准确地粘贴了JSFiddle中的内容以供引用:TogglenavigationBrandLinkLinkDropdownActionAnotheractionSomethingelsehereSepar

javascript - 推特 Bootstrap : How to achieve an always-collapsed navbar dropdown menu?

我在TwitterBootstrap中使用Navbar组件http://getbootstrap.com/components/#navbar我的目标是让导航栏始终折叠(即使在桌面大小的设备上查看时也是如此)。如何做到这一点?我创建了这个JSFIDDLE到目前为止我的代码-你会发现它是非常标准的。当结果窗口的尺寸较小时,下拉菜单会折叠。但是,如果您放大结果窗口,则下拉菜单不会折叠。我已经准确地粘贴了JSFiddle中的内容以供引用:TogglenavigationBrandLinkLinkDropdownActionAnotheractionSomethingelsehereSepar

html - CSS Positioned Absolute Element,父边界之外的自动宽度?

因此,我将我的父元素定位为相对位置,以便让工具提示元素绝对定位在其内部的顶部。我知道您需要添加“左:0,右:0”,这样元素的宽度仍然可以设置为自动,我已经这样做了。但是,我的父元素有一个固定的宽度,工具提示被限制到这个宽度,所以自动宽度不能超出它,有什么办法解决这个问题吗?CSS:.parent{position:relative;width:100px;height:100px;}.tooltip{position:absolute;top:0;left:0;right:0;margin:0auto;text-align:center;width:auto;padding:5px10

html - CSS Positioned Absolute Element,父边界之外的自动宽度?

因此,我将我的父元素定位为相对位置,以便让工具提示元素绝对定位在其内部的顶部。我知道您需要添加“左:0,右:0”,这样元素的宽度仍然可以设置为自动,我已经这样做了。但是,我的父元素有一个固定的宽度,工具提示被限制到这个宽度,所以自动宽度不能超出它,有什么办法解决这个问题吗?CSS:.parent{position:relative;width:100px;height:100px;}.tooltip{position:absolute;top:0;left:0;right:0;margin:0auto;text-align:center;width:auto;padding:5px10