响应式布局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的内在原理,其实就是通过媒体查询来完成对不同 ...
 
随机推荐
- 远程登录oracle 12.2数据库报错ORA-28040解决办法
			
今天新安装的oracle 12.2.0.1数据库,通过本地sqlplus远程登录12c数据库报错ora-28040,如下: ORA-28040: No matching authentication ...
 - arcengine直连sde
			
搞了半天,找了好多资料,实验好多次,终于解决.参考资料:http://www.cnblogs.com/gaxin/p/5777864.html
 - [maven] 初试maven
			
环境 CentOS 6 一, 安装: [root@okk ~]# wget http://mirrors.hust.edu.cn/apache/maven/maven-3/3.5.0/binaries ...
 - nfs的时间问题,影响编译
			
[root@okk dpdk]# rm -rf x86_64-native-linuxapp-gcc/ [root@okk dpdk]# A=`date +%s` ; B=`expr $A + `; ...
 - linux 拷贝软连接文件
			
cp -s sourchfile targetfile 这样拷贝软连接文件时,会将其对应指定路径同步修改,即便原来的软连接是相对路径也不会有问题.
 - 【PyQt5-Qt Designer】液晶显示屏(QLCDNumber)
			
液晶显示屏(QLCDNumber) 总体介绍 QLCDNumber小部件显示一个类似LCD的数字. 它可以显示任何大小的数字.它可以显示十进制,十六进制,八进制或二进制数字.使用display()槽连 ...
 - 重读《深入理解Java虚拟机》四、虚拟机如何加载Class文件
			
1.Java语言的特性 Java代码经过编译器编译成Class文件(字节码)后,就需要虚拟机将其加载到内存里面执行字节码所定义的代码实现程序开发设定的功能. Java语言中类型的加载.连接(验证.准备 ...
 - Perfmon——为什么“% Disk Time”计数器的值会大于100%?
			
最近在使用perfmon做性能测试时发现,“% Disk Time”计数器的值总是会大于100%.如下图所示. perfmon上对“% Disk Time”的中文描述为: % Disk Time 指所 ...
 - 使用 HTMLTestRunner 模块生成HTML格式的测试报告文件
			
1.下载HTMLTestRunner.py HTMLTestRunner 是 Python 标准库的 unittest 模块的一个扩展.它生成易于使用的 HTML 测试报告.HTMLTestRunne ...
 - wxPython:消息对话框MessageDialog
			
wxMessageDialog(wxWindow* parent, const wxString& message, const wxString& caption = "M ...