今天学习了前端的常用框架BootStrap bootstrap的底层其实就是调用了很多html css js等内容 只是把他们封装了起来,所以笔记也就没有记多少
下面还是老样子 贴出笔记供大家参考
JQuery validate插件
是别人封装好的第三方工具
1.导入jqyuery.js
2.导入validate.js
3.在页面加载成功后 对标签进行校验 $("选择器").validate();
4.在validate中编写校验规则
$("选择器").validate({
rules:{},
massage:{}
});
//////////////////////////////////////////////////////////////////
bootstrap:
web前端的css框架
集合了html/css/jquery为一家
创建响应式的页面
响应式就是适配不同的上网设备展示不同的效果
bootstrap的入门
1.下载bootstrap
2.导入boostarp.css
3.导入jquery.js
4.导入bootstrap.js
5.添加一个meta标签 支持移动设备
<meta name="viewport" content="width=device-width,initial-scale=1" >
6.将所有的内容放入到布局容器中
Bootstrap:需要为页面内容和栅格系统包裹一个.container容器,我们提供了两个作此用处的类
方式1:
<div class="container"></div>
<div class="container-fluid"></div>
注意
bootstrap将每一行分成12分
媒体查询:
1.超大的电脑,屏幕的分辨率>1200px 使用 col-lg-2 每行显示6个
2.992<屏幕分辨率<1200 使用 col-md-3 每行显示4个
3.768<屏幕分辨率<992 使用 col-sm-4 每行显示3个
4.屏幕分辨率<768 使用 col-xs-12每行显示1个
///////////////////////////////////////////////////////////////
bootstrap组成部分
全局css样式
组件
js插件
可能也就些基础东西,仅供参考
|
|
收藏
淘帖
踩
