黑马程序员技术交流社区

标题: 【石家庄校区】java小白总结前端前六天的知识笔记-06JQ和bsp [打印本页]

---

作者: 隔壁小白    时间: 2017-11-20 23:52
标题: 【石家庄校区】java小白总结前端前六天的知识笔记-06JQ和bsp
#JQuery
*常用事件
*blur();
*click();
*dblclick();
*focus();
*keydown();
*keyup();
*mouseenter();
*mouseleave();
*submit();
*unload();
*JQ事件的切换
*toggle():单击事件的切换
*hover():鼠标悬停的切换
*JQuery的查找
children();
find();
parent();
*JQ事件的处理
trigger和triggerhandler的区别：
trigger：支持事件冒泡
triggerhandler：不支持

#BootStrap:前端响应式页面
*一套能够在不同设备上能够通用的网页，不影响正常浏览的方式。
*概述
是目前很受欢迎的前端框架。
* 响应式原理
    * 使用CSS3的媒体查询,根据屏幕的分辨率匹配不用的样式.
*使用场景
bs设计出响应式页面，由他设计网页
*全局CSS
bootstrap的框架提供了一系列CSS样式，样式可以直接使用
*布局容器：
container：根据设备给定宽度
container-fluid：类似于100%的宽度，占据全部视口（viewport）的容器
*栅格系统：
栅格样式：
    * 设备的分辨率大于 1200 使用lg样式
    * 设备的分辨率大于 992 < 1200 使用md样式
    * 设备的分辨率大于768 < 992 使用sm样式
    * 设备的分辨率小于 768 使用xs样式
将一行分成12列.定义div元素 样式的和 加一起等于12 即可.
*媒体查询
在栅格系统中，我们在 Less 文件中使用以下媒体查询（media query）来创建关键的分界点                                                                                阈值。
超小屏幕（手机，小于 768px） 没有任何媒体查询相关的代码，因为这在 Bootstrap 中是默认的（ Bootstrap 是移动设备优先） 小屏幕（平板，大于等于 768px）@media (min-width: @screen-sm-min) { ... }中等屏幕（桌面显示器，大于等于 992px）@media (min-width: @screen-md-min) { ... }大屏幕（大桌面显示器，大于等于 1200px）@media (min-width: @screen-lg-min) { ... }

---

欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/)

黑马程序员IT技术论坛 X3.2