发表于: 2018-10-21 21:53:05
2 802
今天学到的东西
1 botstrap
2 删格系统
3 css spirt 雪碧图
一。
botstrap 介绍以及使用
介绍
BootStrap 是Twitter的工程师开发的前端框架,可以非常方便的设计出好看的页面效果。
如何使用
首先下载 bootstap 插件 然后在按顺序引入 顺序不能乱
jquery.min.js
bootstrap.min.css
bootstrap.min.js
二。
删格系统
作用 运用Bootstrap的栅格系统,可以做出像table那样定义多少行,多少列效果,但是又比table灵活。
使用方法
<div class="container">
<div class="row">
<div class="col-xs-6 ">一共12列</div>
<div class="col-xs-6 ">一共12列</div>
</div>
</div>
介绍
col 声明 列设置
md 设备 宽度代码 <768超小屏幕xs >=768小屏幕sm >=992中屏幕md >=1200大屏幕lg
div 占多少空间
三。
雪碧图
介绍
可以把很多的小图标放在一张图上 使用 背景定位 来显示使用哪个图 优点可以快速加载页面减少服务器压力
原理 所有的图标放在一张图上 创建大小和图标一样的盒子 改变背景图像位置来显示不同图标
使用方法
首先图标合成
https://www.toptal.com/developers/css/sprite-generator 在线图标合成器
使用
.icon{
width: 32px;
height:32px;
background:url() no-repeat 0 0;
display; inline-block 变成行元素
}
明天计划的事情
把今天学习的只是在巩固一般还不会用
评论