响应式布局css样式
核心css
/*图片列表样式*/
.img-list{ margin:-15px 0 0 -15px; *display:inline-block; }
/*响应式布局*/
@media screen and (min-device-width: 1161px) { //针对电脑端大分辨率 最小1161像素,使用大括号内的样式
.img-list {
width: 940px;
margin-top: -15px;
margin: -15px 0 0 -15px;
*display: inline-block;
}
} @media screen and (max-device-width: 400px) { //如果屏幕宽度小于400像素,则使用大括号内的样式
.img-list {
width: 708px;
margin-top: -15px;
margin: -15px 0 0 -15px;
*display: inline-block;
}
}
参考:https://www.cnblogs.com/BearLee/p/7928860.html
响应式布局css样式的更多相关文章
- 响应式布局(css,js,php等方法),根据媒体类型设计不同的样式,css在线手册
[css3在线手册]http://css.doyoe.com/ http://blog.csdn.net/duchao123duchao/article/details/52638506 [根据判断 ...
- css中响应式布局中样式的代码书写方法
代码示例:@media only screen and (min-width: 320px){ html { font-size: 8px !important; } .mulu-zi{ positi ...
- HTML5 respond.js 解决IE6~8的响应式布局问题
HTML5 respond.js 解决IE6~8的响应式布局问题 响 应式布局,理想状态是,对PC/移动各种终端进行响应.媒体查询的支持程度是IE9+以及其他现代的浏览器,但是IE8在市场当中仍然 ...
- 响应式布局和BootStrap 全局CSS样式
1.什么是响应式布局 响应式布局是Ethan Marcotte在2010年5月份提出的一个概念,这个概念是为解决移动互联网浏览而诞生的. 简而言之,就是一个网站能够兼容多个终端——而不是为每个终端做一 ...
- 14、响应式布局和BootStrap 全局CSS样式知识点总结-part1
1.什么是响应式布局 响应式布局是Ethan Marcotte在2010年5月份提出的一个概念,这个概念是为解决移动互联网浏览而诞生的. 简而言之,就是一个网站能够兼容多个终端——而不是为每个终端做一 ...
- 15、响应式布局和BootStrap 全局CSS样式知识点总结-part2
1.表格 <div class="container"> <table class="table "> <thead> &l ...
- 一步步开发自己的博客 .NET版 剧终篇(6、响应式布局 和 自定义样式)
前言 这次开发的博客主要功能或特点: 第一:可以兼容各终端,特别是手机端. 第二:到时会用到大量html5,炫啊. 第三:导入博客园的精华文章,并做分类.(不要封我) 第四:做 ...
- css响应式布局RWD
响应式布局结合了三大理念: 1)用于布局的弹性网络(百分比定义宽度) 2)用于图片和视频的弹性媒体 3)媒体查询 在布局中,需要注意的点有: 1)尽量用min-width/max-width,max- ...
- CSS:使用CSS媒体查询创建响应式布局
现如今在Web前端领域,BootStrap是一个最流行的UI库,其12列的栅栏系统为响应式布局提供了一种对程序员来说很好操作的模式. 追究Bootstrap的内在原理,其实就是通过媒体查询来完成对不同 ...
随机推荐
- Python全栈-magedu-2018-笔记11
第三章 - Python 内置数据结构 简单选择排序 简单选择排序 属于选择排序 两两比较大小,找出极值(极大值或极小值)被放置在固定的位置,这个固定位置一般指的是某一端 结果分为升序和降序排列 降序 ...
- python中的str和repr函数的区别
看了一些网上的解释,最主流的解释是“str是给人看的,repr是给机器看的”,如果已经理解了的,这句话是对的,但是是有问题的,对于没懂的,这句话是无法理解的. 我来尝试解释一下.先直译一下官方文档: ...
- [No0000128]SQL纵表与横表互转
1.纵表转横表: 纵表结构:Table1 转换后的横表结构: Sql示例代码: select username, sum(case Course when '语文' then Grade else 0 ...
- [No0000120]Python教程3/9-第一个Python程序
现在,了解了如何启动和退出Python的交互式环境,我们就可以正式开始编写Python代码了. 在写代码之前,请千万不要用“复制”-“粘贴”把代码从页面粘贴到你自己的电脑上.写程序也讲究一个感觉,你需 ...
- piano class 13
1,手放在琴键上,不妨碍另外一只手弹奏即可 2,识别五线谱可以加上几条线,减去几条线,一下子就记住了所有的 3,弹得还是有点快,要慢弹奏,四四拍的理论上比四三拍的还要慢,也要看风格 4,四二拍,强弱, ...
- [daily] 在CentOS7中使用 sanitizer-address 发现内存问题 / CentOS7使用SCLo软件源安装devtoolset软件
接前文: [daily] 内存越界的分析与定位 如前文提及, 使用sanitizer-address 可以有效的检查程序的内存问题. 当时在CentOS7中,虽然也可以使用,但是却遇到如下两个问题: ...
- Python生成器表达式
https://www.cnblogs.com/liu-shuai/p/6098218.html 简介: 生成器表达式并不真正的创建数字列表,而是返回一个生成器对象,此对象在每次计算出一个条目后,把这 ...
- webstorm背景颜色更改
一.file --> settings 二.editor-->color scheme 然后右边下拉选择 三.apply -- > ok
- (4.20)sql server中 len 与datalength 的区别
len是任意字符均为一个占位符字节.datalength是根据字符集不同判断占用,如一个中文占用2个字节.
- RN全局的变量,方法,全局类,全局类方法
为了方便学习,很简单的小Demo,不懂可以下方留言,百分百原创,相互学习,相互进步 全局的方法 创建一个js文件,命名OvallAll //全局的方法 //这里export default 只能输出一 ...