第三方库

1.layer

(1).layer是一种第三方库,用于弹框。

(2).网址:http://layer.layui.com/

(3).引用:

<script src="layer-v3.0.3/layer/layer.js"></script>

(4).案例:

询问框:

layer.confirm('您是如何看待前端开发?', {
btn: ['重要','奇葩'] //按钮
}, function(){
layer.msg('的确很重要', {icon: 1});
}, function(){
layer.msg('也可以这样', {
time: 20000, //20s后自动关闭
btn: ['明白了', '知道了']
});
});

提示层:

layer.msg('玩命提示中');

 (5).layer官网上的代码可直接引用。

2.bootstrap

(1).bootstrap是一种第三方库,用于美化页面。

(2).网址:http://www.bootcss.com/

(3).引用:

<link href="bootstrap/css/bootstrap.css" rel="stylesheet" />

(4).案例:

表格:

<table class="table">
<caption>基本的表格布局</caption>
<thead>
<tr>
<th>名称</th>
<th>城市</th>
</tr>
</thead>
<tbody>
<tr>
<td>Tanmay</td>
<td>Bangalore</td>
</tr>
<tr>
<td>Sachin</td>
<td>Mumbai</td>
</tr>
</tbody>
</table>

按钮:

<button type="button" class="btn btn-primary">按钮</button>

(5).class属性值不能随便更改,如果随便更改样式可能就会消失,如果想在bootstrap样式上添加一些新样式建议使用行内样式。

3.在线编辑器

(1).在线编辑器是一种第三方库,可以让用户获得可编辑效果。

(2).网址:http://kindeditor.net/demo.php

(3).引用

<script src="kindeditor-master/kindeditor-all.js"></script>

(4).案例

在HTML加上

<textarea id="editor_id" name="content" style="700px;height:300px;"></textarea>

script标记中加上

$(function(){

        KindEditor.ready(function(K{

                  window.editor K.create('#editor_id');

        });

});

(5).在线编辑器的引用位置jquery的引用位置的后面,因为在线编辑器里有jquery代码。

原文地址:https://www.cnblogs.com/zhang1999/p/7300673.html