gpt4 book ai didi

ruby-on-rails - Rails 简单导航如何样式化?

转载 作者:数据小太阳 更新时间:2023-10-29 08:33:55 26 4
gpt4 key购买 nike

我正在使用简单的导航 gem 为我的网站创建一些“简单”的导航。

我已经使用 CSS、JQUERY 和 HTML 创建了一个选项卡式菜单。

唯一的问题是创建具有简单导航的完全相同的 CSS 和 HTML。

这是我尝试使用简单导航创建的 HTML:

<ul id="ulmenu">

<li class="topmenuli" id="menufirst">
<a href="#" class="">Frontpage<span id="frontpage"></span></a>
<ul id="submenu" style="display: none;">
<li><a style="font-weight:bolder;text-decoration:underline;background:url(../images/menua.png) no-repeat center bottom;" href="#" class="">Submenu 1</a></li>
<li><a href="#" class="">Submenu 2</a></li>
</ul>
</li>
<li class="topmenuli">
<span style="display:block;" id="pets"></span>
<a href="#">Pets</a>
<ul style="display:none;" id="submenu">
<li><a href="#">Submenu 1</a></li>
<li>Submenu 2</li>
</ul>
</li>
</ul>

我的简单导航配置文件:

SimpleNavigation::Configuration.run do |navigation|

primary.item :frontpage, 'frontpage', root_url, :id => 'menufirst', :class => 'topmenuli'
primary.item :domain, 'Pets', domain_path do |sub_nav|
# Add an item to the sub navigation (same params again)
sub_nav.item :dogs, 'Dogs', dogs_path
end
end

输出:

<ul><li id="menufirst" class="topmenuli selected simple-navigation-active-leaf"><a class="selected" href="http://localhost:3000/"><span>Frontpage</span></a></li>
<li id="petes"><a href="/pets"><span>Pets</span></a></li></ul>

不像我的 HTML。不显示子菜单。我也尝试使用 highligt,但面包屑导航完全错误。

如何创建具有简单导航的 HTML 菜单?

最佳答案

更改 <ul> 的属性容器,使用(例如):

primary.item :domain, 'Pets', domain_path do |sub_nav|
sub_nav.dom_id = 'some_submenu_id'
sub_nav.dom_class = 'some_submenu_class'
sub_nav.item :dogs, 'Dogs', dogs_path
# add any more items you want
end

更改 <li> 的属性元素:

primary.item :domain, 'Pets', domain_path, :class => 'my_class', :id => 'my_id' # etc.

也可以提供自定义 id属性生成器(如 the documentation 中所述):

navigation.id_generator = Proc.new {|key| "my-prefix-#{key}"}

至于你的style属性,我不知道 simple_navigation 是否处理这个,但你所要做的就是创建一些最小的 css 选择器:

.block
{
display: block;
}

.container
{
margin: 1em;
}

...和相关类:

<div class="block container">I will be displayed as a block and have a 1em margin</div>

关于ruby-on-rails - Rails 简单导航如何样式化?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7997079/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com