BootStrap中


Posted in Javascript onDecember 10, 2016

最近在学习bootstrap3.3.5,遇到一个问题搞不清楚<li role="presentation">到底什么含义?

网上到处查国内资料很少,没有表达最贴切含义,在GitHub 查到了相关资料结合“图灵计算机词汇”
在图灵计算机词汇里也可以查询其含义:

presentation 

n. 【Web】表现层;[计] 简报,列表单;【通用软件】演示(来源:图灵计算机词汇表);
n.  赠与,赠送,描述,简述,介绍,陈述,表达;[医] 先露,表象(心理);[经] 提示, 交单;

由此可以推断:presentation在bootstrap<li role="presentation">中意为:【列表单】最为恰当合适。

无序 HTML 列表:

<ul>
 <li>Coffee</li>
 <li>Tea</li>
 <li>Milk</li>
</ul>

注:<ul> 标签定义无序列表,li标签定义无序列表单/项。

 同:<li role="presentation">与<a role="menuitem" ></a>中role扮演角色是大同小异,即菜单列表单/项。

以下列举【案例】:

<div class="dropdown">
 <button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown">
 选择你喜欢的品种
 <span class="caret"></span>
 </button>
 <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
 <li role="presentation" class="dropdown-header">选择你喜欢的水果</li>
 <li role="presentation"><a role="menuitem" tabindex="-1" href="#">苹果</a></li>
 <li role="presentation"><a role="menuitem" tabindex="-1" href="#">香蕉</a></li>
 <li role="presentation"><a role="menuitem" tabindex="-1" href="#">菠萝</a></li>
 <li role="presentation" class="divider"></li>
 <li role="presentation" class="dropdown-header">选择你喜欢的树木</li>
 <li role="presentation"><a role="menuitem" tabindex="-1" href="#">松树</a></li>
 <li role="presentation"><a role="menuitem" tabindex="-1" href="#">白杨</a></li>
 <li role="presentation"><a role="menuitem" tabindex="-1" href="#">柳树</a></li>
 <li role="presentation" class="divider"></li>
 <li role="presentation" class="dropdown-header">选择你喜欢的蔬菜</li>
 <li role="presentation"><a role="menuitem" tabindex="-1" href="#">芹菜</a></li>
 <li role="presentation"><a role="menuitem" tabindex="-1" href="#">萝卜</a></li>
 <li role="presentation"><a role="menuitem" tabindex="-1" href="#">白菜</a></li>
 <li role="presentation" class="divider"></li>
 </ul>
</div>

以上所述是小编给大家介绍的BootStrap中<li role="presentation">真实含义解析,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的,在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
W3C Group的JavaScript1.8 新特性介绍
May 19 Javascript
jQuery带时间的日期控件代码分享
Aug 26 Javascript
js实现表单多按钮提交action的处理方法
Oct 24 Javascript
jQuery树形插件jquery.simpleTree.js用法分析
Sep 05 Javascript
让DIV的滚动条自动滚动到最底部的3种方法(推荐)
Sep 24 Javascript
JavaScript遍历Json串浏览器输出的结果不统一问题
Nov 03 Javascript
angular+ionic 的app上拉加载更新数据实现方法
Jan 16 Javascript
vue实现同一个页面可以有多个router-view的方法
Sep 20 Javascript
vue webpack打包后图片路径错误的完美解决方法
Dec 07 Javascript
javascript删除数组元素的七个方法示例
Sep 09 Javascript
JavaScript 双向链表操作实例分析【创建、增加、查找、删除等】
Apr 28 Javascript
五句话帮你轻松搞定js原型链
Dec 09 Javascript
jQuery Ajax请求后台数据并在前台接收
Dec 10 #Javascript
JS 循环li添加点击事件 (闭包的应用)
Dec 10 #Javascript
JS实战篇之收缩菜单表单布局
Dec 10 #Javascript
javascript动画之磁性吸附效果篇
Dec 09 #Javascript
Canvas 制作动态进度加载水球详解及实例代码
Dec 09 #Javascript
详解自动生成博客目录案例
Dec 09 #Javascript
微信小程序之仿微信漂流瓶实例
Dec 09 #Javascript
You might like
windows下配置apache+php+mysql时出现问题的处理方法
2014/06/20 PHP
ThinkPHP中自定义错误页面和提示页面实例
2014/11/22 PHP
php定义参数数量可变的函数用法实例
2015/03/16 PHP
Symfony2学习笔记之系统路由详解
2016/03/17 PHP
PHP自定义错误处理的方法分析
2018/12/19 PHP
javascript 极速 隐藏/显示万行表格列只需 60毫秒
2009/03/28 Javascript
Html中JS脚本执行顺序简单举例说明
2010/06/19 Javascript
Jquery replace 字符替换实现代码
2010/12/02 Javascript
js兼容的placeholder属性详解
2013/08/18 Javascript
Javascript简单改变表单元素背景的方法
2015/07/15 Javascript
简单实现异步编程promise模式
2015/07/31 Javascript
Jquery1.9.1源码分析系列(六)延时对象应用之jQuery.ready
2015/11/24 Javascript
jquery实现ajax提交表单信息的简单方法(推荐)
2016/08/24 Javascript
js移动焦点到最后位置的简单方法
2016/11/25 Javascript
基于rem的移动端响应式适配方案(详解)
2017/07/07 Javascript
让nodeJS支持ES6的词法----babel的安装和使用方法
2017/07/31 NodeJs
JS+CSS3实现的简易钟表效果示例
2019/04/13 Javascript
解决三元运算符 报错“SyntaxError: can''t assign to conditional expression”
2020/02/12 Javascript
Python 调用VC++的动态链接库(DLL)
2008/09/06 Python
Python类的基础入门知识
2008/11/24 Python
Python批量重命名同一文件夹下文件的方法
2015/05/25 Python
python pip安装包出现:Failed building wheel for xxx错误的解决
2019/12/25 Python
keras 获取某层的输入/输出 tensor 尺寸操作
2020/06/10 Python
opencv 图像礼帽和图像黑帽的实现
2020/07/07 Python
Python try except else使用详解
2021/01/12 Python
CSS3中Color的一些特性介绍
2012/05/27 HTML / CSS
CSS类名支持中文命名的示例
2014/04/04 HTML / CSS
Mio Skincare中文官网:肌肤和身体护理
2016/10/26 全球购物
Miller Harris官网:英国小众香水品牌
2020/09/24 全球购物
Java的基础面试题附答案
2016/01/10 面试题
委托书模板
2014/04/04 职场文书
我为党旗添光彩演讲稿
2014/09/10 职场文书
2014迎国庆标语大全
2014/09/19 职场文书
考试作弊检讨书怎么写?
2014/12/21 职场文书
小学语文教学反思范文
2016/03/03 职场文书
晶体管来复再生式二管收音机
2021/04/22 无线电