这篇文章主要介绍了阿马泽伊列表的实现示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

最近在学习阿马泽伊框架的一些用法,本文主要介绍了阿马泽伊列表,分享给大家,也给自己留个笔记

!声明文档类型

html class=’no-js ‘

meta charset=’utf-8 ‘

meta http-equiv=’ X-UA-Compatible ‘ content=’ IE=edge ‘

元名称=’描述’内容=’ ‘

meta name=’keywords’ content=’ ‘

meta name=’ viewport ‘ content=’ width=device-width,initial-scale=1 ‘

标题列表/标题

meta name=’ renderer ‘ content=’ WebKit ‘

meta http-equiv=’ Cache-Control ‘ content=’ no-site app ‘/

link rel=’ icon ‘ type=’ image/png ‘ href=’ assets/I/favicon。巴布亚新几内亚

元名称=’支持移动网络应用内容=’是’

link rel=’ icon ‘ size=’ 192 x192 ‘ href=’ assets/I/app-icon 72 x72 @ 2x。巴布亚新几内亚

meta name=’ apple-mobile-we b-app-capable ‘ content=’ yes ‘

meta name=’ apple-mobile-we B- app-状态栏-style ‘ content=’ black ‘

meta name=’ apple-mobile-we B- app-title ‘ content=’ Amaze UI ‘/

link rel=’ apple-touch-icon-pre composed ‘ href=’ assets/I/app-icon 72 x 72 @ 2x。巴布亚新几内亚

meta name=’ ms application-tile image ‘ content=’ assets/I/app-icon 72 x72 @ 2x。巴布亚新几内亚

meta name=’ ms应用程序-磁贴颜色’ content=’ # 0e 90d 2 ‘

link rel=’样式表’ href=’ assets/CSS/amaze ui。量滴’ CSS ‘

/头

body style=’ margin:10px;’

!-链接列表-

ul class=’am-list ‘

lia href=’# ‘链接列表/a/李

lia href=’# ‘链接列表/a/李

/ul

!-文字超出截断为「.」 –

ul class=’am-list ‘

lia href=’ # ‘ class=’ am-text-truncate ‘文字超出截断文字超出截断文字超出截断文字超出截断/a/李

/ul

!-纯文字列表-

ul class=’am-list am-list-static ‘

lia href=’# ‘纯文字列表/a/李

lia href=’# ‘纯文字列表/a/李

/ul

!-列表边框-

ul class=’ am-list am-list-static am-list-border ‘

lia href=’# ‘列表边框/a/李

lia href=’# ‘列表边框/a/李

/ul

ul class=’am-list am-list-border ‘

lia href=’# ‘列表边框/a/李

lia href=’# ‘列表边框/a/李

/ul

!-斑马纹-

ul class=’ am-list am-list-static am-list-border am-list-striped ‘

lia href=’# ‘斑马纹/a/李

lia href=’# ‘斑马纹/a/李

/ul

!-组合使用-

ul class=’ am-list am-list-static am-list-border ‘

span=am-badge am-badge-success ‘是/span

span=am-badge am-badge-危险号/span

组合使用

/李

/ul

!-添加表示”像”之义

ul class=’ am-list am-list-static am-list-border ‘

LII class=’ am-icon-home am-icon-fw ‘/I添加图标-/李

LII class=’ am-icon-book am-icon-fw ‘/I添加图标-/李

LII class=’ am-icon-pencil am-icon-fw ‘/I添加图标-/李

/ul

ul class=’am-list am-list-border ‘

lia href=’ # ‘ I class=’ am-icon-home am-icon-fw ‘/I添加图标-/a/李

lia href=’ # ‘ I class=’ am-icon-book am-icon-fw ‘/I添加图标-/a/李

lia href=’ # ‘ I class=’ am-icon-pencil am-icon-fw ‘/I添加图标-/a/李

/ul

!- [if (gte IE 9)|!(IE)]!-

脚本src=’ assets/js/jquery。量滴js ‘/脚本

!- ![endif] –

!-[如果lte IE 8 ]

脚本src=’ assets/ie8/jquery。量滴js ‘/脚本

script src=’ assets/ie8/modernizr。js ‘/脚本

脚本src=’ assets/js/amaze ui。ie 8聚填充。量滴js ‘/脚本

![endif] –

脚本src=’ assets/js/amaze ui。量滴js ‘/脚本

/body

/html

效果图:

https://codes90.oss-cn-hangzhou.aliyuncs.com/2022/10/1664591618-929d0bfaf2f05c2.jpg

到此这篇关于阿马泽伊列表的实现示例的文章就介绍到这了,更多相关阿马泽伊列表内容请搜索脚本之家以前的文章或继续浏览下面的相关文章,希望大家以后多多支持脚本之家!

来源:脚本之家

链接:https://www。jb51。net/html 5/740937。超文本标记语言

发表回复

后才能评论