@media screen and (max-width: 960px)与@media (max-width: 960px) 有screen与没有screen的区别
我们先来看下下面这段代码,估计很多人在响应式的网站CSS很经常看到类似下面的这段代码:
@media screen and (max-width: 960px){
body{
background: #000;
}
}
这个应该算是一个media的一个标准写法,上面这段CSS代码意思是:当页面小于960px的时候执行它下面的CSS.这个应该没有太大疑问。
应该有人会发现上面这段代码里面有个screen,他的意思是在告知设备在打印页面时使用衬线字体,在屏幕上显示时用无衬线字体。但是目前我发现很多网站都会直接省略screen,因为你的网站可能不需要考虑用户去打印时,你可以直接这样写:
@media (max-width: 960px){
body{
background: #000;
}
@media screen and (max-width: 960px)与@media (max-width: 960px) 有screen与没有screen的区别的更多相关文章
- [转载]利用@media screen实现网页布局的自适应,@media screen and
开始研究响应式web设计,CSS3 Media Queries是入门.Media Queries,其作用就是允许添加表达式用以确定媒体的环境情况,以此来应用不同的样式表.换句话说,其允许我们在不改变内 ...
- 利用@media screen实现网页布局的自适应,@media screen and
开始研究响应式web设计,CSS3 Media Queries是入门.Media Queries,其作用就是允许添加表达式用以确定媒体的环境情况,以此来应用不同的样式表.换句话说,其允许我们在不改变内 ...
- 优先级:content –> width –> flex-basis (limted by max|min-width)
原文: https://www.jianshu.com/p/17b1b445ecd4 -------------------------------------------- 最近在学习Flex Bo ...
- canvas里设置width和css里设置width和js里设置width的区别
canvas.width 和 它的style.width是不一样的: canvas是个画布,有他自己的宽和高(默认是没有单位的纯数字),就是canvas.width和canvas.height的宽和高 ...
- Math.min() Math.max() Math.min().apply() Math.max() .apply()该如何使用???
Math.min()和 Math.max() 语法: Math.min(x,y) Math.max(x,y) 虽然能取到最小值和最大值,但是不支持数组. 那么如何计算数组中的大小值呢???????? ...
- Azure Media Service (1) 使用OBS进行Azure Media Service直播
<Windows Azure Platform 系列文章目录> 今天正好有客户问如何使用OBS进行Azure Media Service直播,我这里简单介绍一下. 先决条件: 1. OBS ...
- 转:Canvas标签的width和height以及style.width和style.height的区别
转自:http://www.cnblogs.com/artwl/archive/2012/02/28/2372042.html 作者:Artwl 背景 今天在博问中看到一个问题:用canvas 的 l ...
- 利用@media screen实现网页布局的自适应
利用@media screen实现网页布局的自适应 优点:无需插件和手机主题,对移动设备友好,能够适应各种窗口大小.只需在CSS中添加@media screen属性,根据浏览器宽度判断并输出不同的长宽 ...
- media screen 响应式布局(知识点)
一.什么是响应式布局? 响应式布局是Ethan Marcotte在2010年5月份提出的一个概念,简而言之,就是一个网站能够兼容多个终端--而不是为每个终端做一个特定的版本.这个概念是为解决移动互联网 ...
随机推荐
- npm和yarn的使用对比
NPM YARN 说明 npm init yarn init 初始化某个项目 npm install/link yarn install/link 默认的安装依赖操作 npm install taco ...
- android开发(46) 使用 textview实现文字的阴影效果,浮雕效果
前言 最近看到一些文字的阴影效果很有意思,尝试了下,形成本文.“平面效果“是我们平时常见的平面的样子.“阴影效果”会给人一种凸起的感觉.浮雕效果会给一种雕刻“凹陷”的感觉. 演示效果图 方法 使用 t ...
- vue模板语法
Vue.js 使用了基于 HTML 的模版语法,允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据.所有 Vue.js 的模板都是合法的 HTML ,所以能被遵循规范的浏览器和 HTML 解 ...
- 【转】ELK到底是什么鬼?辣么多公司用!
Sina.饿了么.携程.华为.美团.freewheel.畅捷通 .新浪微博.大讲台.魅族.IBM...... 这些公司都在使用ELK!ELK!ELK! ELK竟然重复了三遍,是个什么鬼? 一. ...
- make INSTALL_MOD_PATH=path_dir modules_install
The INSTALL_MOD_PATH variable is needed to install the modules in the target root filesystem instead ...
- 前端分页插件pagination
摘要: 最近在开发项目中又用到了前端分页,以前也做过,为了方便以后使用所以将他封装成第三方插件,不依赖任何库.网上已经有很多插件,问什么还要自己造轮子? 自己写的扩展性高 不依赖任何库 作为一次技术沉 ...
- 给 Advice 传递参数
参数绑定是在下面这个方法中做的:org.springframework.aop.aspectj.AbstractAspectJAdvice#invokeAdviceMethod(JoinPoint j ...
- akka cluster 初体验
cluster 配置 akka { actor { provider = "akka.cluster.ClusterActorRefProvider" } remote { log ...
- offsetHeight,clientHeight,scrollHeight,offsetY等属性的理解
el.offsetHeight = height + padding + border(滚动条是在边框内的,自然也包括在内) el.clientHeight = 可视化看到的高度 (就是content ...
- C语言指针赋值前的指向问题
以下代码运行会得到什么结果? #include<stdio.h> int main() { int *k;//定义一个指针变量 *k=100;#给指针变量所指的内存赋值 printf(&q ...