发表于: 2019-01-30 20:04:39

1 745


今天完成的事情:(一定要写非常细致的内容,比如说学会了盒子模型,了解了Margin) 

栅格选项

从上面的截图可以看出来,Bootstrap针对不同尺寸的屏幕(包括手机、平板、PC等等)设置了不同的样式类,这样让开发人员在开发时可以有更多的选择。根据我的理解:如果在一个元素上使用多个不同的上面的样式类,那么元素会根据在不同尺寸选择最合适(匹配最理想的)的样式类。简单的举例进行说明:比如在一个元素上我们使用了两个样式类:.col-md-和.col-lg。

基本用法

网格系统用来布局,其实就是列的组合。Bootstrap框架的网格系统中有四种基本的用法。由于Bootstrap框架在不同屏幕尺寸使用了不同的网格样式,在这一节中所涉及到的示例,我们都以中屏(970px)为例进行介绍,其他屏幕的使用也类似这一种。

我们可以对编写css响应性web设计有一个规范,如下:

1. 头部reset.css 是否要独立出来一个css文件,或者不独立出来 直接放在css顶部

2. 公用的头部或者尾部样式 直接放在css文件顶部,及公用的页面css样式放在顶部(添加注释。

3. 媒体查询css样式分别如下组织:

1. 移动端开发css媒体查询

2. 在PC端 1000以上的媒体查询写在如下里面:

@media screen and (min-width:1000px) {

/* css style*/

}



明天计划的事情:(一定要写非常细致的内容) 

继续完成任务
遇到的问题:(遇到什么困难,怎么解决的) 

暂无
收获:(通过今天的学习,学到了什么知识)

同今天完成的事情


返回列表 返回列表
评论

    分享到