bootstrap响应式页面

释放双眼，带上耳机，听听看~！

响应式页面（Responsive web page）2010年提出，是可以智能的根据用户使用的设备来选择排版布局和样式的页面的，就是一套代码适用于多个设备，特点是不会出现横向的滚动条。响应式页面设计其实在实际的应用中并不是很广泛，一般具有一定规模的网站都会有移动端、PC端、pad端等几套代码，根据运行的设备来选择加载的代码。但是响应式页面也存在一定的作用，可以用作一些展示性的页面。

常规的网站，大部分是1200px，缩小会出现横向滚动条，布局，样式全都不会改变。

响应式页面也存在了一些不足，比如页面内容不宜过多，只适合做一些展示类的网站不能有过于复杂的动画。

自适应页面就是有多套代码，根据不同设备加载不同的代码。

bootstrap目前到第四版，版本2主要做PC端已经逐步淘汰了，主要用的是移动设备优先的3，4也是移动设备优先，放弃了老版本的IE，看实际情况使用。

bootstrap共有五大块，起步、全局css样式、组件、JavaScript插件、定制。主要应用就是classname需要记住。

1.响应式网站如何编写：　　

1）必须声明viewport（重点重点）
<meta name="viewport" content="width=device-width,initial-scale=1.0">
2）使用流式布局
float:left , display:inline-block
3）文字，图片，容器…使用相对尺寸（70%，em，rem），不要使用绝对尺寸（px）

2.em和rem的区别（面试题）　　

em是一个相对单位，相对父元素
rem是一个相对单位，相对于页面的根元素，即html

4.最重要的原则：媒体查询技术 css3中的内容 media query
写响应式的时候一般不需要去管高度，高度让其自己去变化，响应式肯定是不会有横向的滚动条，纵向就不一定了

做响应式页面的代码的一般设置的步骤有：

1）指定语言的类型 <html lang="zh-CN">

2）设置meta标签，为了兼容老版本的IE <meta http-equiv="X-UA-Compatible" content="IE=edge">

3）必须项，设置视口 <meta name="viewport" content="width=device-width, initial-scale=1">

4）引入bootstrap的主文件 <link rel="stylesheet" href="bootstrap-3.3.5-dist/css/bootstrap.css">

5）处理兼容性的js文件，用cssHack 条件注释法　　　　　　

<!–[if lt IE 9]>
<script src="bootstrap-3.3.5-dist/js/html5shiv.min.js"></script>
<script src="bootstrap-3.3.5-dist/js/respond.min.js"></script>
<![endif]–>

6）引入jquery，因为bootstrap是依赖于jquery，所以jquery必须放在前面先加载，最好使用bootstrap自己带的jquery。

7）引入bootstrap中所需要用到的JavaScript插件。<script src="bootstrap-3.3.5-dist/js/bootstrap.js"></script>

模板是


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
1&lt;!DOCTYPE html&gt;

2&lt;!-- 1.指定语言的类型 --&gt;

3&lt;html lang=&quot;zh-CN&quot;&gt;

4&lt;head&gt;

5    &lt;meta charset=&quot;UTF-8&quot;&gt;

6    &lt;!-- 2.设置meta标签，为了兼容老版本的IE --&gt;

7    &lt;meta http-equiv=&quot;X-UA-Compatible&quot; content=&quot;IE=edge&quot;&gt;

8    &lt;!-- 3.必须项，设置视口 --&gt;

9    &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1&quot;&gt;

10    &lt;title&gt;Document&lt;/title&gt;

11

12    &lt;!-- 4.引入bootstrap的主文件 --&gt;

13    &lt;link rel=&quot;stylesheet&quot; href=&quot;bootstrap-3.3.5-dist/css/bootstrap.css&quot;&gt;

14

15    &lt;!-- 5.处理兼容性的js文件

16        cssHack  条件注释法 --&gt;

17    &lt;!--[if lt IE 9]&gt;

18      &lt;script src=&quot;bootstrap-3.3.5-dist/js/html5shiv.min.js&quot;&gt;&lt;/script&gt;

19      &lt;script src=&quot;bootstrap-3.3.5-dist/js/respond.min.js&quot;&gt;&lt;/script&gt;

20    &lt;![endif]--&gt;

21&lt;/head&gt;

22&lt;body&gt;

23    &lt;div class=&quot;container&quot;&gt;     &lt;!-- 最大的一个使用宽度为970px --&gt;

24        这个是container容器

25    &lt;/div&gt;

26    &lt;div class=&quot;container-fluid&quot;&gt;     &lt;!-- 使用宽度为100% --&gt;

27        这个是container-fluid容器

28    &lt;/div&gt;

29

30

31    &lt;!-- 6.引入jquery，因为bootstrap是依赖于jquery，所以jquery必须放在前面先加载 --&gt;

32    &lt;!-- 最好使用bootstrap自己带的jquery --&gt;

33    &lt;script src=&quot;bootstrap-3.3.5-dist/js/jquery-1.11.3.js&quot;&gt;&lt;/script&gt;

34    &lt;!-- 7.引入bootstrap中所需要用到的JavaScript插件 --&gt;

35    &lt;script src=&quot;bootstrap-3.3.5-dist/js/bootstrap.js&quot;&gt;&lt;/script&gt;

36&lt;/body&gt;

37&lt;/html&gt;

38

一、全局css样式

1.栅格系统

栅格系统是由bootstrap提供的一套响应式、移动设备优先的流式栅格系统，随着屏幕尺寸把屏幕自动分成最多12列。

媒体查询

超小屏幕
手机
(<768px)（总是水平排列） .col-xs-

小屏幕
平板 (≥768px) 　　　　 .col-sm-

中等屏幕
桌面显示器 (≥992px) .col-md-

大屏幕
大桌面显示器 (≥1200px) .col-lg-

3.bootstrap提供的一些图标，bootstrap提供了二百多个图标，可以用span标签来使用


1
2
3
4
5
6
7
8
9
1&lt;h3&gt;图标&lt;/h3&gt;   

2    &lt;span class=&quot;glyphicon glyphicon-home&quot;&gt;&lt;/span&gt;

3    &lt;span class=&quot;glyphicon glyphicon-signal&quot;&gt;&lt;/span&gt;

4    &lt;span class=&quot;glyphicon glyphicon-cog&quot;&gt;&lt;/span&gt;

5    &lt;span class=&quot;glyphicon glyphicon-apple&quot;&gt;&lt;/span&gt;

6    &lt;span class=&quot;glyphicon glyphicon-trash&quot;&gt;&lt;/span&gt;

7    &lt;span class=&quot;glyphicon glyphicon-play-circle&quot;&gt;&lt;/span&gt;

8    &lt;span class=&quot;glyphicon glyphicon-headphones&quot;&gt;&lt;/span&gt;

9

4.bootstrap提供的一些按钮及其样式，可以用btn-lg、btn-sm和btn-xs来调整按钮的大小。

bootstrap响应式页面

样式是预定义的样式，

btn-default 默认样式

btn-primary 首选项

btn-success 成功

btn-info 一般信息

btn-warning 警告

btn btn-danger 危险


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
1&lt;h3&gt;按钮&lt;/h3&gt;

2    &lt;button type=&quot;button&quot; class=&quot;btn btn-default&quot;&gt;按钮&lt;/button&gt;

3    &lt;button type=&quot;button&quot; class=&quot;btn btn-primary&quot;&gt;primary&lt;/button&gt;

4    &lt;button type=&quot;button&quot; class=&quot;btn btn-success&quot;&gt;success&lt;/button&gt;

5    &lt;button type=&quot;button&quot; class=&quot;btn btn-info&quot;&gt;info&lt;/button&gt;

6    &lt;button type=&quot;button&quot; class=&quot;btn btn-warning&quot;&gt;warning&lt;/button&gt;

7    &lt;button type=&quot;button&quot; class=&quot;btn btn-danger&quot;&gt;danger&lt;/button&gt;

8    

9    &lt;h3&gt;按钮尺寸&lt;/h3&gt;

10    &lt;button type=&quot;button&quot; class=&quot;btn btn-default&quot;&gt;按钮&lt;/button&gt;

11    &lt;button type=&quot;button&quot; class=&quot;btn btn-primary btn-lg&quot;&gt;primary&lt;/button&gt;

12    &lt;button type=&quot;button&quot; class=&quot;btn btn-success btn-sm&quot;&gt;success&lt;/button&gt;

13    &lt;button type=&quot;button&quot; class=&quot;btn btn-info btn-xs&quot;&gt;info&lt;/button&gt;

14

15    &lt;h3&gt;把图标显示在按钮里&lt;/h3&gt;

16    &lt;button type=&quot;button&quot; class=&quot;btn btn-default&quot;&gt;&lt;span class=&quot;glyphicon glyphicon-home&quot;&gt;&lt;/span&gt;  按钮&lt;/button&gt;

17

5.文本

常用文本对齐

.textleft 文本左对齐

.text-center 文本居中对齐

.text-right 文本右边对齐


1
2
3
4
5
6
7
1&lt;p class=&quot;text-left&quot;&gt;Left aligned text.&lt;/p&gt;

2&lt;p class=&quot;text-center&quot;&gt;Center aligned text.&lt;/p&gt;

3&lt;p class=&quot;text-right&quot;&gt;Right aligned text.&lt;/p&gt;

4&lt;p class=&quot;text-justify&quot;&gt;Justified text.&lt;/p&gt;

5&lt;p class=&quot;text-nowrap&quot;&gt;No wrap text.&lt;/p&gt;

6

7

6.响应式图片

.img-responsive可以设置响应式布局，本质就是设置了max-width: 100%;、 height: auto; 和 display: block;

如果需要水平居中的话使用.center-block。

7.一些常用的类

关闭按钮 . Close 可以让模态框和警告框小时

三角符号 .caret 可以指示有下拉菜单的功能

快速浮动 pull-left 左浮动右边浮动同理

内容块居中 center-block

清除浮动 .clearfix

二、组件

1.一些图标

bootstrap响应式页面

　　还有很多，可以参考手册。

2.下拉菜单

bootstrap响应式页面


1
2
3
4
5
6
7
8
9
10
11
12
13
14
1&lt;h3&gt;下拉菜单&lt;/h3&gt;

2    &lt;div class=&quot;dropdown&quot;&gt;

3      &lt;button class=&quot;btn btn-primary dropdown-toggle&quot; type=&quot;button&quot; id=&quot;dropdownMenu1&quot; data-toggle=&quot;dropdown&quot; aria-expanded=&quot;true&quot;&gt;

4        Dropdown

5        &lt;span class=&quot;caret&quot;&gt;&lt;/span&gt;

6      &lt;/button&gt;

7      &lt;ul class=&quot;dropdown-menu&quot; role=&quot;menu&quot; aria-labelledby=&quot;dropdownMenu1&quot;&gt;

8        &lt;li role=&quot;presentation&quot;&gt;&lt;a role=&quot;menuitem&quot; tabindex=&quot;-1&quot; href=&quot;#&quot;&gt;Action&lt;/a&gt;&lt;/li&gt;

9        &lt;li role=&quot;presentation&quot;&gt;&lt;a role=&quot;menuitem&quot; tabindex=&quot;-1&quot; href=&quot;#&quot;&gt;Another action&lt;/a&gt;&lt;/li&gt;

10        &lt;li role=&quot;presentation&quot;&gt;&lt;a role=&quot;menuitem&quot; tabindex=&quot;-1&quot; href=&quot;#&quot;&gt;Something else here&lt;/a&gt;&lt;/li&gt;

11        &lt;li role=&quot;presentation&quot;&gt;&lt;a role=&quot;menuitem&quot; tabindex=&quot;-1&quot; href=&quot;#&quot;&gt;Separated link&lt;/a&gt;&lt;/li&gt;

12      &lt;/ul&gt;

13    &lt;/div&gt;

14

还有一种按钮式下拉菜单

bootstrap响应式页面

点几按钮可以出现下来菜单


1
2
3
4
5
6
7
8
9
10
11
12
13
1&lt;div class=&quot;btn-group&quot;&gt;

2  &lt;button type=&quot;button&quot; class=&quot;btn btn-default dropdown-toggle&quot; data-toggle=&quot;dropdown&quot; aria-haspopup=&quot;true&quot; aria-expanded=&quot;false&quot;&gt;

3    Action &lt;span class=&quot;caret&quot;&gt;&lt;/span&gt;

4  &lt;/button&gt;

5  &lt;ul class=&quot;dropdown-menu&quot;&gt;

6    &lt;li&gt;&lt;a href=&quot;#&quot;&gt;Action&lt;/a&gt;&lt;/li&gt;

7    &lt;li&gt;&lt;a href=&quot;#&quot;&gt;Another action&lt;/a&gt;&lt;/li&gt;

8    &lt;li&gt;&lt;a href=&quot;#&quot;&gt;Something else here&lt;/a&gt;&lt;/li&gt;

9    &lt;li role=&quot;separator&quot; class=&quot;divider&quot;&gt;&lt;/li&gt;

10    &lt;li&gt;&lt;a href=&quot;#&quot;&gt;Separated link&lt;/a&gt;&lt;/li&gt;

11  &lt;/ul&gt;

12&lt;/div&gt;

13

3.按钮组，可以设置单选框或者复选框的行为

bootstrap响应式页面


1
2
3
4
5
6
1&lt;div class=&quot;btn-group&quot; role=&quot;group&quot; aria-label=&quot;...&quot;&gt;

2  &lt;button type=&quot;button&quot; class=&quot;btn btn-default&quot;&gt;Left&lt;/button&gt;

3  &lt;button type=&quot;button&quot; class=&quot;btn btn-default&quot;&gt;Middle&lt;/button&gt;

4  &lt;button type=&quot;button&quot; class=&quot;btn btn-default&quot;&gt;Right&lt;/button&gt;

5&lt;/div&gt;

6

8.输入框

bootstrap响应式页面


1
2
3
4
5
6
7
8
9
10
11
1&lt;h3&gt;输入框&lt;/h3&gt;

2    &lt;div class=&quot;input-group&quot;&gt;

3      &lt;span class=&quot;glyphicon glyphicon-user&quot;&gt;&lt;/span&gt;

4      &lt;input type=&quot;text&quot; placeholder=&quot;username&quot;&gt;

5    &lt;/div&gt;

6

7    &lt;div class=&quot;input-group&quot;&gt;

8      &lt;span class=&quot;glyphicon glyphicon-lock&quot;&gt;&lt;/span&gt;

9      &lt;input type=&quot;password&quot; placeholder=&quot;password&quot;&gt;

10    &lt;/div&gt;

11

9.导航栏

bootstrap响应式页面


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
1&lt;h3&gt;导航栏&lt;/h3&gt;

2    &lt;nav class=&quot;navbar navbar-inverse navbar-fixed-top&quot;&gt;

3        &lt;div id=&quot;navbar&quot; class=&quot;navbar-collapse collapse&quot;&gt;

4          &lt;ul class=&quot;nav navbar-nav&quot;&gt;

5            &lt;li class=&quot;active&quot;&gt;&lt;a href=&quot;#&quot;&gt;Home&lt;/a&gt;&lt;/li&gt;

6            &lt;li&gt;&lt;a href=&quot;#about&quot;&gt;About&lt;/a&gt;&lt;/li&gt;

7            &lt;li&gt;&lt;a href=&quot;#contact&quot;&gt;Contact&lt;/a&gt;&lt;/li&gt;

8            &lt;li class=&quot;dropdown&quot;&gt;

9              &lt;a href=&quot;#&quot; class=&quot;dropdown-toggle&quot; data-toggle=&quot;dropdown&quot; role=&quot;button&quot; aria-expanded=&quot;false&quot;&gt;Dropdown &lt;span class=&quot;caret&quot;&gt;&lt;/span&gt;&lt;/a&gt;

10              &lt;ul class=&quot;dropdown-menu&quot; role=&quot;menu&quot;&gt;

11                &lt;li&gt;&lt;a href=&quot;#&quot;&gt;Action&lt;/a&gt;&lt;/li&gt;

12                &lt;li&gt;&lt;a href=&quot;#&quot;&gt;Another action&lt;/a&gt;&lt;/li&gt;

13                &lt;li class=&quot;divider&quot;&gt;&lt;/li&gt;

14                &lt;li class=&quot;dropdown-header&quot;&gt;Nav header&lt;/li&gt;

15                &lt;li&gt;&lt;a href=&quot;#&quot;&gt;Separated link&lt;/a&gt;&lt;/li&gt;

16              &lt;/ul&gt;

17            &lt;/li&gt;

18          &lt;/ul&gt;

19        &lt;/div&gt;&lt;!--/.nav-collapse --&gt;

20      &lt;/div&gt;

21    &lt;/nav&gt;

22

10.表单

bootstrap响应式页面


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
1&lt;h3&gt;表单&lt;/h3&gt;

2    &lt;form&gt;

3    &lt;div class=&quot;form-group&quot;&gt;

4      &lt;span class=&quot;glyphicon glyphicon-user&quot;&gt;&lt;/span&gt;

5      &lt;input type=&quot;email&quot; id=&quot;exampleInputEmail1&quot; placeholder=&quot;Enter email&quot;&gt;

6    &lt;/div&gt;

7    &lt;div class=&quot;form-group&quot;&gt;

8      &lt;span class=&quot;glyphicon glyphicon-lock&quot;&gt;&lt;/span&gt;

9      &lt;input type=&quot;password&quot; id=&quot;exampleInputPassword1&quot; placeholder=&quot;Password&quot;&gt;

10    &lt;/div&gt;

11    &lt;div class=&quot;form-group&quot;&gt;

12      &lt;label for=&quot;exampleInputFile&quot;&gt;File input&lt;/label&gt;

13      &lt;input type=&quot;file&quot; id=&quot;exampleInputFile&quot;&gt;

14      &lt;p class=&quot;help-block&quot;&gt;Example block-level help text here.&lt;/p&gt;

15    &lt;/div&gt;

16    &lt;div class=&quot;checkbox&quot;&gt;

17      &lt;label&gt;

18        &lt;input type=&quot;checkbox&quot;&gt; Check me out

19      &lt;/label&gt;

20    &lt;/div&gt;

21    &lt;button type=&quot;submit&quot; class=&quot;btn btn-default&quot;&gt;Submit&lt;/button&gt;

22  &lt;/form&gt;

23


1
2
112.进度条

2

bootstrap响应式页面


1
2
3
4
5
6
7
1&lt;h3&gt;进度条&lt;/h3&gt;

2    &lt;div class=&quot;progress&quot;&gt;

3      &lt;div class=&quot;progress-bar&quot; role=&quot;progressbar&quot; aria-valuenow=&quot;70&quot; aria-valuemin=&quot;0&quot; aria-valuemax=&quot;100&quot; style=&quot;width: 60%;&quot;&gt;

4        70%

5      &lt;/div&gt;

6    &lt;/div&gt;

7

三、JavaScript插件

1.模态框

模态框经过了优化，更加灵活，以弹出对话框的形式出现，具有最小和最实用的功能集。

实现一个静态的模态框 bootstrap响应式页面


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
1&lt;div class=&quot;modal fade&quot; tabindex=&quot;-1&quot; role=&quot;dialog&quot;&gt;

2  &lt;div class=&quot;modal-dialog&quot; role=&quot;document&quot;&gt;

3    &lt;div class=&quot;modal-content&quot;&gt;

4      &lt;div class=&quot;modal-header&quot;&gt;

5        &lt;button type=&quot;button&quot; class=&quot;close&quot; data-dismiss=&quot;modal&quot; aria-label=&quot;Close&quot;&gt;&lt;span aria-hidden=&quot;true&quot;&gt;×&lt;/span&gt;&lt;/button&gt;

6        &lt;h4 class=&quot;modal-title&quot;&gt;Modal title&lt;/h4&gt;

7      &lt;/div&gt;

8      &lt;div class=&quot;modal-body&quot;&gt;

9        &lt;p&gt;One fine body…&lt;/p&gt;

10      &lt;/div&gt;

11      &lt;div class=&quot;modal-footer&quot;&gt;

12        &lt;button type=&quot;button&quot; class=&quot;btn btn-default&quot; data-dismiss=&quot;modal&quot;&gt;Close&lt;/button&gt;

13        &lt;button type=&quot;button&quot; class=&quot;btn btn-primary&quot;&gt;Save changes&lt;/button&gt;

14      &lt;/div&gt;

15    &lt;/div&gt;&lt;!-- /.modal-content --&gt;

16  &lt;/div&gt;&lt;!-- /.modal-dialog --&gt;

17&lt;/div&gt;&lt;!-- /.modal --&gt;

18

19

模态框有两个可选尺寸，.modal-dialog 可以增加一个样式调整类实现

可以将选项通过data属性传递，将参数名称放到data-后面就可以了

keyboard 键盘上esc按下关闭模态框

show 模态框初始化后就显示出来

remote 如果提供的是 URL，将利用 jQuery 的 load 方法从此 URL 地址加载要展示的内容（只加载一次）并插入 .modal-content 内。如果使用的是 data 属性 API，还可以利用 href 属性指定内容来源地址。

方法：

.modal(options) 将页面中的某块内容作为模态框激活　　

.modal('toggle') 手动打开或关闭模态框。　　

.modal('show') 手动打开模态框。

.modal('hide') 手动隐藏模态框。

2.滚动监听

滚动监听插件是用来根据滚动条所处的位置来自动更新导航项的.

用法：依赖bootstrap的导航组件，需要相对定位，通过data属性或者JavaScript调用。

参数：data-offset = 计算滚轮对于顶部的距离（px）

3.弹出框

为任意元素添加一个小浮层

弹出框 bootstrap响应式页面


1
2
1&lt;button type=&quot;button&quot; class=&quot;btn btn-lg btn-danger&quot; data-toggle=&quot;popover&quot; title=&quot;Popover title&quot; data-content=&quot;And here&#x27;s some amazing content. It&#x27;s very engaging. Right?&quot;&gt;点我弹出/隐藏弹出框&lt;/button&gt;

2

点击并让弹出框消失


1
2
1&lt;a tabindex=&quot;0&quot; class=&quot;btn btn-lg btn-danger&quot; role=&quot;button&quot; data-toggle=&quot;popover&quot; data-trigger=&quot;focus&quot; title=&quot;Dismissible popover&quot; data-content=&quot;And here&#x27;s some amazing content. It&#x27;s very engaging. Right?&quot;&gt;可消失的弹出框&lt;/a&gt;

2

4.警告框

bootstrap响应式页面


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
1&lt;h3&gt;警告框&lt;/h3&gt;

2    &lt;div class=&quot;alert alert-warning alert-dismissible&quot; role=&quot;alert&quot;&gt;

3       &lt;button type=&quot;button&quot; class=&quot;close&quot; data-dismiss=&quot;alert&quot; aria-label=&quot;Close&quot;&gt;&lt;span aria-hidden=&quot;true&quot;&gt;&amp;times;&lt;/span&gt;&lt;/button&gt;

4       &lt;strong&gt;Warning!&lt;/strong&gt; Better check yourself, you&#x27;re not looking too good.

5    &lt;/div&gt;

6    &lt;div class=&quot;alert alert-success&quot; role=&quot;alert&quot;&gt;

7        &lt;a href=&quot;#&quot; class=&quot;alert-link&quot;&gt;success!&lt;/a&gt;

8    &lt;/div&gt;

9    &lt;div class=&quot;alert alert-info&quot; role=&quot;alert&quot;&gt;

10        &lt;a href=&quot;#&quot; class=&quot;alert-link&quot;&gt;info!&lt;/a&gt;

11    &lt;/div&gt;

12    &lt;div class=&quot;alert alert-warning&quot; role=&quot;alert&quot;&gt;

13        &lt;a href=&quot;#&quot; class=&quot;alert-link&quot;&gt;warning!&lt;/a&gt;

14    &lt;/div&gt;

15    &lt;div class=&quot;alert alert-danger&quot; role=&quot;alert&quot;&gt;

16        &lt;a href=&quot;#&quot; class=&quot;alert-link&quot;&gt;danger!&lt;/a&gt;

17    &lt;/div&gt;

18

转载于:https://www.cnblogs.com/wangzheng98/p/11209612.html

{{userData.name}}已认证

bootstrap响应式页面

二、组件

三、JavaScript插件

md5 加密算法

C++ 高性能服务器网络框架设计细节

{{userData.name}}已认证

二、组件

三、JavaScript插件

Related posts:

md5 加密算法

C++ 高性能服务器网络框架设计细节

前端点滴（Node.js）（五）---- 构建 Web 应用（四）中间件、Express 基础与实例

基于Node.js的自动化构建工具Grunt.js

什么是nodejs?

Rust语言