页面特效 UI组件库 菜单导航 窗口特效 幻灯片滑动 图像相册 表单 选项卡 表格 评分星级 手风琴 文本链接 布局 日历 颜色选择器 按钮 图表 html5 提示 ExtJS 在线客服 其他特效 地图 树形控件 移动开发 BootStrap 滑动条 文件上传 表单验证 分页 播放器 Angular VUE

轻量,小巧且精美的UI库 方便迅速搭建手机H5应用light7

UI组件库 移动开发 HTML我帮您 1年前  次浏览

Light7 是一个库而不是一个框架。它提供了 20+ 个常用的组件,却只有 82K JS 和 117K CSS 大小的两个文件。大部分时候你只需把组件的HTML代码复制到自己的HTML文件中即可。

基本结构、使用rem、初始化、内容区、文本样式、标题栏、工具栏、按钮、表单、侧栏、搜索栏、标签页、栅格、对话框、加载指示器、Toast、Popover、Popup、日历、操作表、Picker、日期时间、列表、卡片、滚动条、下拉刷新、无限滚动、Notification New、图标、路由、夜间模式、颜色主题、

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>我的生活</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1">
    <link rel="shortcut icon" href="/favicon.ico">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">

    <link rel="stylesheet" href="css/light7.min.css">
    <link rel="stylesheet" href="css/light7-swiper.min.css">

    <link rel="stylesheet" href="/your-css-file.css">
  </head>
  <body>
    <!-- 你的html代码 -->
    <script type='text/javascript' src='js/jquery.min.js' charset='utf-8'></script>
    <script type='text/javascript' src='js/light7.min.js' charset='utf-8'></script>
    <script type='text/javascript' src='js/light7-swiper.min.js' charset='utf-8'></script>

    <script src="/your-js-file.js"></script>
  </body>
</html>


相关链接

发表评论