Question

我试图模仿本教程，创建一个简单的Apple主题面包屑，在这里找到： http://www.jankoatwarpspeed.com/post/2008/08/14/Create-applecom-like-breadcrumb-using-simple-CSS.aspx

即使在查看更新的示例并从此处下载源代码之后： http://www.lostsockdesign.com.au/apple-breadcrumb/index.html

我无法告诉HTML和CSS如何“知道”它当前是哪个页面。

显然，如果您的浏览器指向“http://www.lostsockdesign.com.au/apple-breadcrumb/index2.html”，则浏览器知道您在此页面上，但HTML或CSS的哪一部分指定了面包屑应该省略后续页面的图形，并且淡出当前的页面图形？

抱歉这个简单的问题.. xD

更新

好的，现在已经解决了，任何人都有一个建议，让最简单的方法来实现一个脚本来处理这个问题吗？

Answer 1

没有。

该教程仅用于样式，而不是用于生成面包屑;你必须自己做，通过某种脚本或手动。

重新：更新

Breadcrumbs本质上是您网站树下的当前路径。从站点地图开始（不是在XML，SEO意义上，而是在站点的实际页面结构中。例如：

Home
JavaScript
    Vanilla
        Gallery
        Lightbox
        Dice Roller
    jQuery
        Cycle
        Click Tracker
Blog
    RSS
    Web Development
        Object Oriented CSS
        Currying Functions in JavaScript
        CSS Reset Files
    Gaming
        Review: Super Mario Bros.
        Camping Strategy in Oregon Trail
        So Your Mom Wants to Play Wii Golf
Portfolio
    DEA Website
    We <3 Kittens
    Nobody Likes IE6

因此，如果您在“CSS重置文件”页面上，则按照（未显示）根目录中的树，显示您在面包屑中找到的每个级别，结果如下：

My Site -> Blog -> CSS -> CSS Reset Files

此数据可以存储在数据库中并使用您选择的服务器端语言提取，也可以使用服务器端或客户端脚本根据目录结构自动生成，也可以手动将其编码为你的每一页。

你如何做到完全取决于你，但这是基本概念。

Answer 2

你不使用HTML和CSS（CSS3有一些有限的功能，但我不认为他们已经准备好了黄金时间）来弄清楚你在哪个页面。通常使用服务器端软件（例如CMS）输出面包屑，并使用CSS类名来指示哪个页面是当前页面等。

CSS面包屑的工作原理有多简单

2 个答案: