这篇文章主要介绍了AmazeUI评论列表的实现示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
最近在学习AmazeUI框架,今天给大家分享的是AmazeUI评论列表的实现示例,也给自己留个学习记录
!声明文档类型
html class='no-js '
头
meta charset='utf-8 '
元http-equiv=' X-UA-兼容'内容='IE=edge '
元名称='描述'内容=' '
元名称='关键字'内容=' '
元名称='视口'内容='宽度=设备宽度,初始比例=1 '
标题评论列表/title
meta name=' renderer ' content=' web kit '
元http-equiv='缓存-控制'内容='no-siteapp'/
link rel=' icon ' type=' image/png ' href=' assets/I/fav icon。png '
meta name=' mobile-web-app-ability ' content=' yes '
link rel=' icon ' size=' 192 x 192 ' href=' assets/I/app-icon 72 x72 @ 2x。png '
meta name=' apple-mobile-web-app-ability ' content=' yes '
meta name=' apple-mobile-web-app-status-bar-style ' content=' black '
meta name=' apple-mobile-web-app-title ' content='拍案惊奇UI'/
link rel=' apple-touch-icon-precompted ' href=' assets/I/app-icon 72 x72 @ 2x。png '
meta name=' ms application-Tileimage ' content=' assets/I/app-icon 72 x72 @ 2x。png '
meta name=' ms application-TileColor ' content=' # 0e 90d 2 '
链接rel='样式表href=' assets/CSS/amazeui。量滴' CSS '
/head
body style=' margin: 10px '
!-基本结构-
文章类别='am-comment '!-评论容器-
a href=' '
img class=' am-comment-avatar ' alt=' src=' img/100。jpg '/!-评论者头像-
/a
div class='am-comment-main '!-评论内容容器-
header class='am-comment-hd '
!- h3 class='am-comment-title '评论标题/h3 -
div class='am-comment-meta '!-评论元数据-
a href=' # link-to-user ' class=' am-comment-author '超一/a!-评论者-
评论于time datetime=' 2016-02-17/time
/div
/header
div class='am-comment-bd '阅谁问君诵,水落清香浮/div!-评论内容-
/div
/articlebr
!-单条评论-
文章类别='am-comment '
a href='#link-to-user-home '
img src=' img/100。jpg ' alt=' class=' am-comment-avatar ' width=' 48 ' height=' 48 '/
/a
div class='am-comment-main '
header class='am-comment-hd '
!- h3 class='am-comment-title '评论标题/h3 -
div class='am-comment-meta '
a href=' # link-to-user ' class=' am-comment-author '超一/a