“面包屑” Breadcrumb 和格林童话

最新推荐文章于 2024-03-31 09:49:46 发布
最新推荐文章于 2024-03-31 09:49:46 发布
阅读量389 收藏
点赞数
原文链接：https://my.oschina.net/zgldh/blog/1835784
版权

为什么80%的码农都做不了架构师？>>>   hot3.png

Breadcrumb “面包屑” 就是很多网站、应用上表示当前用户所在页面层次的组件。

红框内就是“面包屑”

为何叫“面包屑”？看到英文原文也是 Breadcrumb 更令我莫名其妙。

直到有一天回想起了一个童话：《韩塞尔与葛雷特》 出自格林童话。

https://baike.baidu.com/item/%E9%9F%A9%E5%A1%9E%E5%B0%94%E4%B8%8E%E8%91%9B%E9%9B%B7%E7%89%B9/10193482

故事中的两个小主人公为了不在森林中迷路，边走边洒下面包屑作为路标。（果然最后被小动物吃完了 233）

就是这么简单的出处。

那么如果不翻译成“面包屑”，有别的合适词语么？叫“导航”，“足迹”好像都不合适。所以还是叫面包屑吧。

转载于:https://my.oschina.net/zgldh/blog/1835784

weixin_33708432
关注
angular7 面包屑 breadcrumb
freya_dr的博客
07-08 735
创建组件breadcrumb，如图 breadcrumb.component.html 中代 码如下图 <nz-breadcrumb class='breadcrumb'> <nz-breadcrumb-item *ngFor="let item of breadcrumbsAll"> <a (click)="toPage(item)">{{ item.label }}</a> </nz-bread...
面包屑对格林童话里的兄妹没有帮助，但对你的网站有
Bytebase的博客
10-12 619
早上看产研周报的时候瞄到一眼「面包屑」三个字，因为是个面包脑袋，所以快速识别到了这几个字，在我的认知里，面包屑和 Bytebase 好像并不对付？其实这里说的是面包屑导航啦，加上图是不是容易理解一点！
面包屑的由来
nn54321的博客
12-08 428
面包屑
Bootstrap 路径导航breadcrumb
weixin_30315905的博客
08-13 187
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>路径导航breadcrumb</title> <!-- breadcrumb(约定俗成,且可被搜索引擎爬到) ...
Element Breadcrumb 面包屑的使用方法
10-15
例如，"首页 > 组件 > Breadcrumb面包屑" 或 "活动列表 > 活动详情"，这样用户可以轻松地追溯和跳转到先前的页面。 Element Breadcrumb 组件的基本用法涉及以下几个部分： 1. **引入组件**：在使用前，需要确保...
bootstrap动态添加面包屑(breadcrumb)及其响应事件的方法
10-19
它提供了一套现成的界面组件，包括面包屑导航（breadcrumb），这是一种辅助用户理解他们在网站中的位置并能够快速返回之前页面的导航形式。在实际应用中，我们常常需要动态地添加面包屑并为其绑定事件处理，以响应...
为nuxt项目写一个面包屑cli工具实现自动生成页面与面包屑配置
01-20
这个CLI工具的实现包括两个主要部分：命令行接口的实现和面包屑的实现。 首先，我们要实现CLI命令。这通常涉及到使用Node.js和一个名为`commander`的库来处理命令行参数。通过`init`命令，用户可以在新项目中初始化...
当我们进入主页时，加载了哪些组件
DDAD9527的博客
10-13 283
首先我们的组件都是挂载到App.vue上,根据路由的不同,显示不同的组件,一般人资管理后台都是两个一级路由,登录页login和具体内容页Layout,已经若干个二级路由或三级路由组成 <template> <div id="app"> <router-view /> </div> </template> 以Layout为例来展开使用的组件 抛开验证token及路由拦截来讲,当打开初始网页 / 时显示Layout组件 .
第13章 vue-admin-template
最新发布
richieandndsc的博客
03-31 3573
这是一套简单的vue基础课程，主要介绍vue,vue-router,axios,vuex,element-ui等等
当我们打开首页时，加载了哪些组件
qq_45000453的博客
10-14 489
一.咋我在启动项目后可以通过浏览器查看都是先挂载在App.vue主组件上，显示不同的组件如图下图所示: 一般来说人资后台都是两个一级路由，分别是Login登录页和Layout具体内容页，和若干个二级路由和三级路由组成。 <template> <div id="app"> <router-view /> </div> </template> <script> export default { name:.
关于vue项目 vue-admin-template中主页所使用的组件
mmmawo的博客
10-14 1311
一.什么是vue组件 组件是vue当中最强大的功能之一.组件可以扩展HTML元素,封装重用的代码.在较高的层面上,组件是自定义元素.所有的vue组件同时也是vue实例,所以可以接受相同的选项对象(除了一些吭叽特有选项)并且提供相同的生命周期钩子函数. 二.入口程序分析 顶层组件:src/App.vue 入口js文件:src/main.js 路由js文件:src/router/index.js 入口html文件:public/index.html ...
angular使用NG ZORRO来构建博客展示项目(简单实现展示页面)
weixin_34163741的博客
12-06 342
返回目录 使用 NG ZORRO 在上一篇文章中，我们已经安装了NG ZORRO，并在跟模块中引入了，在子模块中使用还需要再次引入。 编辑layout模块中的header组件 在layout.module.ts中引入NG ZORRO import { NgZorroAntdModule } from 'ng-zorro-antd'; ...
关于breadcrumb面包屑
qq_36398269的博客
09-23 1589
1.面包屑作用 显示当前页面在系统层级结构中的位置，并能向上返回。 2.面包屑层级结构 标签“nz-breadcrumb”里包含面包屑的内容 标签“nz-breadcrumb-item”里包含页面各个层级里的内容，一个“nz-breadcrumb-item”包含一个层级，“nz-breadcrumb-item”的前后顺序对应层级在结构中的位置。 <nz-breadcrumb> ...
Laravel Breadcrumbs 自动面包屑导航
weixin_34216196的博客
05-10 446
说明laravel-breadcrumbs 可为你的 Laravel 项目快速定制拥有 Bootstrap 风格的面包屑导航。本文章由 The EST Group 成员 @Kelvin 撰写, 首发地为 PHPHub 社区.文章的 Demo 项目截图运行Demo 代码请见：https://github.com/CycloneAxe/est-breadcrumbs-demo请参...
徽章组件
weixin_33858249的博客
03-18 185
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <meta name="viewport" content="width=device-width,initial...
一个最骚的面包屑导航
热门推荐
festone000的专栏
06-22 10万+
一个用纯html+css3实现的优雅面包屑导航，附技术点分析。
Breadcrumb 面包屑
07-27
面包屑（Breadcrumb）是一种网站导航设计元素，用于显示用户当前所处页面的位置路径。它通常以一种线性结构呈现，显示用户从主页到当前页面的路径。面包屑的作用是帮助用户快速了解自己在网站中的位置，并提供返回上...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值