- 博客(34)
- 收藏
- 关注
RSS订阅原创 bootstrap图片相关类
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"/>
2018-07-23 15:03:19
502
原创 bootstrap按钮相关类
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"/>
2018-07-23 14:58:25
229
原创 bootstrap案例3
1.html文件0-homework.html<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <link rel="stylesheet&qu
2018-07-23 14:55:22
333
原创 bootstrap案例2
1.html文件 01-exercise.html<!doctype html><html> <head> <title>网页</title> <meta charset="utf-8"> <style></style> &a
2018-07-23 14:49:58
202
原创 Bootstrap案例1
html文件 my_mediaQuery.html<!doctype html><html> <head> <title>网页</title> <meta charset="utf-8"> <style></style> &a
2018-07-23 14:44:51
217
原创 时钟动画例子
<!doctype html><html> <head> <title>网页</title> <meta charset="utf-8"> <style> #clock{ width:400px; height:400px
2018-07-23 14:38:37
328
原创 bootstrap全局CSS样式-按钮相关类
不同颜色按钮： .btn 基本按钮 .btn-danger 危险 .btn-success 成功 .btn-warning 警告 .btn-info 信息 .btn-primary 主要按钮 .btn-secondary 次要按钮 .btn-dark 黑色 .btn-light 浅色 .btn-l...
2018-07-23 14:36:27
499
原创 Bootstrap基本模板
<meta name="viewport" content="width=device-width,initial-scale=1.0"/> <link rel="stylesheet" href="css/bootstrap.css"/> <script src="js/jquery.min.js"&a
2018-07-23 14:32:15
207
原创 bootstrap注意
1.声明viewport元标签 <meta name="viewport" content="width=device-width, initial-scale=1.0"> viewport元标签： 早期3G手机为了浏览大尺寸网页，只能强行把网页缩小，导致图片，文字等变小。ios提出了“视口”，视口用于盛放网页内容，超过部分，可以滑动显示。 ...
2018-07-23 14:31:10
165
原创 CSS优化
1.尽量减少HTTP请求 2.页面顶部引入css文件 3.将css和js放到外部独立文件中 4.合并样式，减少样式重写 5.选择更优的选择器和属性来写样式 6.避免空src和href...
2018-07-23 14:21:12
112
原创 Bootstrap 组件---折叠
<!--控制内容的隐藏和显示，在<a>或<button>元素上添加data-toggle="collapse"属性。data-target="#id"属性是对应折叠的内容。 注意：<a>元素上可以使用href属性来代替data-target属性。 ex: <a href="#demo1" class="b
2018-07-21 09:14:55
178
原创 Bootstrap 组件案例—导航栏
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"/&am
2018-07-21 09:14:46
524
原创 Bootstrap 组件---折叠导航栏
<!--要创建折叠导航栏，需要在按钮上添加navbar-toggler,data-toggle="collapse"与data-target="#id"，然后在设置了class="collapse navbar-collapse"类的div上包裹导航内容（链接），div元素上的id匹配按钮data-target的上指定的id。--><!DOCTYPE html>...
2018-07-21 09:14:36
6572
原创 Bootstrap 组件---卡片
<！--通过.card与.card-body类来创建一个卡片 .card-header类用于创建卡片头部 .card-footer类用于创建卡片底部 <div class="card"> <div class="card-header">头部</div> <div class="car
2018-07-21 09:14:17
3531
1
原创 Bootstrap 组件案例---手风琴：折叠和卡片
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"/&g
2018-07-21 09:13:52
1051
原创 Bootstrap 组件---导航栏
<!--使用.navbar类创建导航栏，后面紧跟.navbar-expand-xl/lg/md/sm类来创建响应式的导航栏（大屏幕铺开显示，小屏幕垂直堆叠） 导航栏上的选项可以使用<ul>元素并添加navbar-nav类，然后在<li>元素上添加nav-item类，<a>元素上使用nav-link类--><!DOCTYPE htm...
2018-07-20 18:51:17
262
原创 Bootstrap 组件---导航（胶囊导航）
<!--使用.nav-pills类可以将导航设置为胶囊形状。 胶囊动态设置需要将data-toggle属性设置为data-toggle="pil--><!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <
2018-07-20 18:47:04
2609
原创 Bootstrap 组件---导航（选项卡导航）
<!--使用.nav-tabs类可将将导航转换为选项卡 如果要设置选项卡动态可切换，可以在每个链接上添加data-toggle="tab"属性，然后在每个选项对应的内容上添加.tab-pane类 <ul class="nav nav-tabs"> <li class="nav-item"> <a..
2018-07-20 18:45:38
2450
原创 Bootstrap 组件---导航（水平/垂直导航）
<!-- 创建一个简单的水平导航栏，可以在<ul>元素上添加.nav类，在每个<li>选项上添加.nav-item类，在每个链接上添加.nav-link类。 <ul class="nav"> <li class="nav-item"> <a class="nav-li
2018-07-20 18:35:42
7277
原创 Bootstrap 组件---信息提示框
<!—<div class="alert alert-* alert-dismissible"> <span data-dismiss="alert" class="close">X</span></div>--><!DOCTYPE html>&l
2018-07-20 18:24:43
999
原创 Bootstrap 组件---按钮组
<!--在<div>元素上添加.btn-group类来创建按钮组。 <div class="btn-group"> <a class="btn btn-success">按钮1</a> <a class="btn btn-danger">按钮2<
2018-07-20 18:20:27
249
原创 Bootstrap 组件---下拉菜单
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"/>
2018-07-20 18:19:08
154
原创 Bootstrap 表单例子
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"/>
2018-07-20 18:10:47
1251
原创 Bootstrap 表单
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"/>
2018-07-20 18:09:25
263
原创 Bootstrap弹性布局
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"/>
2018-07-20 18:07:35
1786
1
翻译 css面试题（部分1）
CSS介绍一下标准的CSS的盒子模型？低版本IE的盒子模型有什么不同的？（1）有两种， IE 盒子模型、W3C 盒子模型；（2）盒模型： 内容(content)、填充(padding)、边界(margin)、 边框(border)；（3）区 别： IE的content部分把 border 和 padding计算了进去;CSS选择符有哪些？哪些属性可以继承？* 1.id选择器（ # myid）2...
2018-07-12 10:09:33
156
翻译 css面试题
请解释一下为什么会出现浮动和什么时候需要清除浮动？清除浮动的方式移动端的布局用过媒体查询吗？使用 CSS 预处理器吗？喜欢那个？SASS (SASS、LESS没有本质区别，只因为团队前端都是用的SASS)CSS优化、提高性能的方法有哪些？浏览器是怎样解析CSS选择器的？在网页中的应该使用奇数还是偶数的字体？为什么呢？margin和padding分别适合什么场景使用？抽离样式模块怎么写，说出思路...
2018-07-12 10:08:27
212
翻译 html面试题（部分1）
HTMLDoctype作用？标准模式与兼容模式各有什么区别? DOCTYPE :文本类型的声明 作用：告诉浏览器HTML的版本类型 语法：<!doctype html>在最顶端编写（1）、<!DOCTYPE>声明位于HTML文档中的第一行，处于<html> 标签之前。告知浏览器的解析器用什么文档标准解析这个文档。DOCTYPE...
2018-07-11 12:00:43
175
原创 .注册页面，当用户名文本框失去焦点时要验证该用户名是否在数据库中已存在，如果已存在就不能让用户注册，否则可以注册（用ajax实现）。
后台：myPro.jsconst express=require('express');var router=express.Router();var pool=require('../pool.js');router.post('/ajaxlogin',(req,res)=>{ var $uname=req.body.uname; if(!$uname){ res.send('用...
2018-07-09 19:20:43
10244
原创 把修改的信息提交到后台
点击03-sel-update.html中的提交按钮，将修改后的用户信息提交给myPro.js后台：myPro.jsconst express=require('express');var router=express.Router();var pool=require('../pool.js');router.post('/ajaxlogin',(req,res)=>{ var $u...
2018-07-09 19:09:12
978
原创 修改用户信息，点击修改连接跳转到03-sel-update.html,这个页面一加载时就应该显示出当前用户的所有信息
后台：myPro文件const express=require('express');var router=express.Router();var pool=require('../pool.js');//查询所有用户数据router.get('/pro_List',(req,res)=>{ var sql='select * from xz_user'; pool.query(sql...
2018-07-07 11:11:48
4849
原创 前端发起异步请求，将接收到的所有用户数据以表格的方式展示在网页中。点击表格的删除，根据uid删除用户。
后台：myPro.js文件const express=require('express');var router=express.Router();var pool=require('../pool.js');router.post('/ajaxlogin',(req,res)=>{ var $uname=req.body.uname; if(!$uname){ res.send(...
2018-07-07 10:34:10
623
原创 前端发起异步请求，将接收到的所有用户数据以表格的方式展示在网页中。
后台：myPro.js文件const express=require('express');var router=express.Router();var pool=require('../pool.js');//查询所有用户数据，接收数据用getrouter.get('/pro_List',(req,res)=>{ var sql='select * from xz_user'; po...
2018-07-07 10:10:34
1472
原创 异步登录（包含前后端：post请求）
在public平级目录中添加一个文件夹myPro,同时在routes文件中添加一个myPro.js文件 1.在app.js中托管静态资源，挂路由 托管：app.use(express.static('myPro')); 路由： var myPro=require('./routes/myPro.js'); app.use('/myPro',myPro);...
2018-07-07 09:19:41
1873
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人