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 相关文章推荐
探讨在JQuery和Js中,如何让ajax执行完后再继续往下执行
Jul 09 Javascript
在每个匹配元素的外部插入新元素的方法
Dec 20 Javascript
js操作iframe父子窗体示例
May 22 Javascript
JavaScript sub方法入门实例(把字符串显示为下标)
Oct 17 Javascript
js兼容pc端浏览器并有多种弹出小提示的手机端浮层控件实例
Apr 29 Javascript
学习vue.js表单控件绑定操作
Dec 05 Javascript
webpack配置打包后图片路径出错的解决
Apr 26 Javascript
使用webpack4编译并压缩ES6代码的方法示例
Apr 24 Javascript
详细分析Node.js 多进程
Jun 22 Javascript
javascript实现贪吃蛇小游戏
Jul 28 Javascript
微信小程序获取当前时间及星期几的实例代码
Sep 20 Javascript
Vue router配置与使用分析讲解
Dec 24 Vue.js
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
PHP分页显示制作详细讲解
2006/12/05 PHP
php使用Jpgraph绘制3D饼状图的方法
2015/06/10 PHP
PHP中使用jQuery+Ajax实现分页查询多功能操作(示例讲解)
2017/09/17 PHP
php中的依赖注入实例详解
2019/08/14 PHP
thinkPHP5框架路由常用知识点汇总
2019/09/15 PHP
为jquery.ui.dialog 增加“在当前鼠标位置打开”的功能
2009/11/24 Javascript
使用jQuery的将桌面应用程序引入浏览器
2010/11/19 Javascript
让AJAX不依赖后端接口实现方案
2012/12/03 Javascript
JS异常处理的一个想法(sofish)
2013/03/14 Javascript
给Flash加一个超链接(推荐使用透明层)兼容主流浏览器
2013/06/09 Javascript
浅析JavaScript中两种类型的全局对象/函数
2013/12/05 Javascript
通过正则表达式实现表单验证是否为中文
2014/02/18 Javascript
jquery实现简单实用的轮播器
2017/05/23 jQuery
浅谈vue的踩坑路
2017/08/31 Javascript
解决layui轮播图有数据不显示的情况
2019/09/16 Javascript
js对象属性名驼峰式转下划线的实例代码
2020/09/17 Javascript
python正则表达式re模块详解
2014/06/25 Python
Python argv用法详解
2016/01/08 Python
python3实现指定目录下文件sha256及文件大小统计
2019/02/25 Python
Flask配置Cors跨域的实现
2019/07/12 Python
python 函数嵌套及多函数共同运行知识点讲解
2020/03/03 Python
Python unittest生成测试报告过程解析
2020/09/08 Python
采用怎样的方法保证数据的完整性
2013/12/02 面试题
请问软件开发中的设计模式你会使用哪些
2015/05/13 面试题
主题实践活动总结
2014/05/08 职场文书
团日活动总结报告
2014/06/25 职场文书
教师民族团结演讲稿
2014/08/27 职场文书
村干部群众路线整改措施思想汇报
2014/10/12 职场文书
普通员工辞职信范文
2015/05/12 职场文书
“5.12”护士节主持词
2015/07/04 职场文书
辞职信怎么写?
2019/05/21 职场文书
2020年基层司法所建设情况调研报告
2019/11/30 职场文书
vue引入Excel表格插件的方法
2021/04/28 Vue.js
MySql新手入门的基本操作汇总
2021/05/13 MySQL
ConstraintValidator类如何实现自定义注解校验前端传参
2021/06/18 Java/Android
微信小程序APP的事件绑定以及传递参数时的冒泡和捕获
2022/04/19 Javascript