DiQuick(Web前端框架) v1.3.2 官方版

授权方式：免费软件
软件类型：国产软件
软件语言：简体中文
软件大小：200 KB
推荐星级：
软件厂商：Home Page
更新时间：2019-03-26 08:40
网友评论：0 条
运行环境：WinXP, Win2003, Vista, Win7, Win8, Win10
好评：89.02%

坏评：10.98%

gx developer 8.86中文版支持win7277 MB/简体中文/免费软件
AdAppMgrIPC.dll118 KB/简体中文/免费软件
altium designer 2016 v16.1.17 320 bytes/简体中文/免费软件
SIEMENS STEP 7 v5.6 官方版2.23 GB/简体中文/免费软件
ArcGIS Desktop 10.3.1中文版附974 MB/简体中文/免费软件
ollydbg 64位(反汇编调试工具) v2.10 MB/简体中文/免费软件

软件介绍
相关文章
猜你喜欢
网友评论
下载地址

DiQuick框架是一款轻量化的web UI框架，采用CSS3来实现各种复杂的效果，在脚本中对文档添加了监听事件，让前端渲染变得更轻松。大大简化了HTML结构，实现组件自动实例化，有从事前端框架开发的朋友不要错过，欢迎来本站下载！

基本介绍

DiQuick Web UI框架，采用HTML+CSS3+JS，配置有响应式布局及预定义设置，包含诸多组件：Nav、Tab、Media、Form、Menu、Slider、Dialog等，致力于开发轻量化、语义化、扩展性强的Web UI框架。

软件特点

1、效果与兼容性

框架中的组件多数采用了CSS3来实现border-radius圆角、box-shadow阴影、transition过渡等效果，这意味着IE8及更老旧的浏览器将不能支持这些特性，CSS3让Web元素的效果制作变的更便捷，减少了图片的需求且加快了读取速率，框架文件并不会对这些效果作兼容处理。

2、内容的展现

在框架中，我们推崇组件与展现之间分离，展现由块布局、偏移、隐藏等系统来实现，元素及组件的布局将依赖于它们，只有在考虑部分组件能够通过预定义样式减少对子元素的设定时，我们才会为组件自身添加排列或布局的样式。

3、盒模型

我们对整个框架设定了box-sizing:border-box边框盒模型，它的好处是可以简易设定元素尺寸，为元素指定的任何padding内边距和border边框的值都将在已设定的宽度和高度内进行绘制，不会导致元素总尺寸发生变化，在部分元素需要使用margin外边距来设定时，采用calc()函数来进行了相应数值的剔除。

4、类名与选择器

在样式命名中，遵循了语义化的结构，也尽量缩减了类名的标识，采用了递进选取元素的方式，例如设定tab选项卡组件，我们对组件导航选用了class="nav"而不是class="tab-nav"，因为在样式表中已限定了只有tab组件才能使用它，部分非装取大量内容的组件中甚至不需要你设置子元素类名，因为在css及js文件中都使用了特定选择器来控制元素，并且保证了其他元素插入时不会受到影响。

5、事件与方法

脚本中对文档添加了监听事件，组件将自动遍厉进行事件的绑定，不必在每次加载后手动设置脚本初始化，这意味着你可以任意使用JS插入节点或HTML，如果你引用了JQuery，则可以使用html()、load()等方法来插入组件内容，前端渲染将变的非常轻松，并且不会对已绑定事件的组件重复绑定，确保了性能的优化。

内容介绍

diquick

diquick.css 66kb

diquick.js 20kb

src

flaticon.eot 71kb

flaticon.svg 337kb

flaticon.ttf 71kb

DiQuick框架使用说明

安装框架css及js文件

<link rel="stylesheet" href="./diquick/diquick.css">
<script src="./diquick/diquick.js"></script>

文档Document

获取文档

html5文档类型，简体中文设定为lang="zh-CN"

<!DOCTYPE html>
<html lang="en">
    ...
</html>

为了兼容更多的移动设备，在之中添加以下标签，如果你希望开启用户缩放功能，可以将user-scalable=no删除。

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

快速获得一个完整的文档

<!DOCTYPE html>
<html lang="en">

<head>
    <title>Title</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta name="keywords" content="keywords">
    <meta name="description" content="description"> 
    <link rel="stylesheet" href="./diquick/diquick.css">
</head>

<body>
    <div class="wrapper">
        <div class="shell">
            <h1>Hello! DiQuick</h1>
        </div>
    </div>
    <script src="./diquick/diquick.js"></script>
</body>

</html>