标签：md bootstrap col sm div 熟练 class 页面
day50
昨日回顾
事件冒泡
组织后续事件发生
return false;
e.stopPropagation()
事件委托
$('父类').on(‘事件名称’,'子代选择器',function(){})
页面载入
$(document).ready(function(){})
$((function)(){})
each循环
li = [11,22,33]
$.each(li,function(k,v){})
$('.c1').each(function(k,v)(){})
data
$('div').data('key','value')
$('div').removeData('key')今日内容
Bootstrap
快速开发框架 html css js 都封装好了
现在时，三个在一块
CSS 把fonts 的东西都加载进入了 但是必须有那个文件夹 一块 ，相对引入content = 'width=device-width，initial-scale=1' 按照设备等比缩放为 1 手机电脑适配 按照的是获取窗口大小的那个
栅格系统
0 auto 上下零边距 左右居中
12 等份 中间两个 就是居中
container-fluid 设置了padding
虽然 100% 大小 但是两边有留白
布局：
cox-sizing:content-box
border-box pading大了，content笑了，总大小是一定的
<div class="col-md-12"> // 12 块 6块在左边
媒体查询
捕获手机的宽度 设置不同的样式
media@().....
@media (min-width: @screen-sm-min) { ... }响应式
针对不同的屏幕宽度，把网页做出不同的大小
这样就不换行了 col-md-6 换行
div class='col-md-6 col-sm-6 c1' 中等屏幕 小屏幕
或者 直接用 .col-xs- 自动调节大小（自动适配手机） 不换行列嵌套
<div class="row">
<div class="col-sm-9">
Level 1: .col-sm-9 // 文本内容
<div class="row">
<div class="col-xs-8 col-sm-6">
Level 2: .col-xs-8 .col-sm-6
</div>
<div class="col-xs-4 col-sm-6">
Level 2: .col-xs-4 .col-sm-6
</div>
</div>
</div>
</div>列偏移
col-md-4 col-md-offset-4 往右偏移4个
也是用margin做的，只不过封装好了列排序
push-6 往右边走6个
pull-6 往左边走6个h1 - h6 主题
b 的 p标签变大了
mark 标签自带高亮
strong 变粗
用bootstrap 给你封装了这些很多 可以查看
<p class='text-uppercase c1 c2 c3'>
基本缩略语
首字母缩略语
带下划线的文本<u>
斜体 <em>
无序列表
list-inline
code 标签
用户输入kbd
校验状态
has-error 红色警告
has-warning
图标
span class=''
比如 span(style = 'red' 'gly gly-ast')
控件尺寸
input 框变大变小
内在其实是给input框加高度day51
昨日回顾
引入
bootstrap 引入
本地 link href ='bootstrap.min.css'
网络js 前端加密 自动登陆好了 自动筛选车票
预订车次加密了 号 反混淆 反爬虫 本来好爬 现在不好爬了 用到继承什么的去网上查 公司信息 比较重视的 一般的不用加密基本模板
布局容器
div class = 'container' 两边有留白
div class = 'container-fluid' 布满整个窗口 宽度上 高度上一般不限定死的 网页内容多 就高栅格系统
class = 'row' 一行
class = 'col-md-6' 占6列 <992时, 就用samll
又分了12列
列排序
超小屏幕的：col-xs-xx
小屏幕的：col-sm-xx
中屏幕的： col-md-
大屏幕的： col-lg-
列偏移
class = 'col-md-6 offset 3'
class = 'col-md-6 col-md-push-6'
拉回来
class = 'col-md-6 col-md-pull-6'
列嵌套
div class=row
div class='col-sm-9' 将上面的9列加载了12列
div class='row'
div class='col-xs-8-'媒体查询
可以做响应式表格
不想要了，自己设置覆盖他
table-striped 带条纹的
table class='table table-hover' 悬停有色状态类
颜色：active warnning danger info successs 表单
form
提交
form-group 一组 has-success 都变成绿色图标
ok 图标
feedback 反馈 ✔变色不喜欢怎么办
自带的不好看，
怎么做，去网上搜各种
jQuery 滚轮插件 表格插件专业的前端
他们的库很多
别人的
自己写好的，准备用的
搭建个页面分分钟的事，这是他们的基本功iconfont
iconfont 比较强大 想要的图标都有
class = 'iconfont icon'fontawesome
split
pulse 旋转兼容性
iconfont 和 fontawesome 和 bootstrap 是相互兼容的
但是引用了多的话可能就不兼容了 如：fa 和别的fa 重了的话组件
必须把css 和 js 文件都引入
bootstrap 以来jQuery 所以先引入jQ分割线
drop 下拉
分割线： s嵌套
href('#')
不刷新 JavaScript：void(0)
如果刷新就会没了 ， 不利于调试vue的弊端
路飞学城专业的是怎样的操作
标签页
又称 导航 table
京东栏 商品评价
div在下面加文字图片就成胶囊式的标签页
nav nav-pills 标签页固定在顶端
nav-fixed-top
nav-fixed-buttom active
class= 'active' 被选中了 灰色的北京颜色啥是锚点
mysql
bin-log 记录日志 创建文件等等都备份 必须要写的
solo-log
监控慢日志
读取慢日志的条数有多少条
搞好关系 运维 dba 有些sql语句写出来很牛巨幕
大背景 jumbotron模态对话框
点击就能用轮播图
设置图片宽度 img{ width:100%;} 宽度铺满
data-interval = '1000'; 轮播时间间隔
js代码
S(''){
}作业
添加 模态对话框
编辑还没做呢？
浮动 pull-right
快速搭页面
信息收集卡
标签：md,bootstrap,col,sm,div,熟练,class,页面 来源： https://www.cnblogs.com/Doner/p/10861570.html
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。