@media 响应式布局
能根据宽 高 屏幕等一些标签的变化来应用不同的样式叫响应式，如：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
@media (min-width: 800px) {
.c1{
background: blue;
height:30px;
}
}
@media (min-width: 1000px) {
.c1{
background: red;
height:38px;
}
}
</style>
</head>
<body>
<div class="c1"></div>
</body>
</html>
@media 响应式布局的更多相关文章
- @media响应式布局
@media可以根据屏幕尺寸调节布局 @media screen and (min-width:100px) and (max-width:200px){ div { color:red; } } 在 ...
- css的响应式布局和动画
把响应式布局和动画放在一起写是因为他们有个共同点@符号 先讲讲响应式布局@media 响应式布局==曾经==非常的流行,这种布局方式可以做出一也兼容一切设备的页面,但是当页面的功能越来越多,css文件 ...
- media screen 响应式布局(知识点)
一.什么是响应式布局? 响应式布局是Ethan Marcotte在2010年5月份提出的一个概念,简而言之,就是一个网站能够兼容多个终端--而不是为每个终端做一个特定的版本.这个概念是为解决移动互联网 ...
- CSS3学习笔记--media query 响应式布局
语法:@media screen and (min-width: 320px) and (max-width : 479px) media属性后面跟着的是一个 screen 的媒体类型(上面说过的十种 ...
- css3 @media 实现响应式布局
使用css3的@media,可以实现针对不同媒体.不同分辨率的响应式布局. 方法1:根据不同分辨率使用不同css文件 <link rel="stylesheet" media ...
- CSS3 响应式布局： @media (min/max-width:***) @font-face
响应式布局 responsive design @media 属性 bootstrap css 分析: @media (min-width:768px){ body{***} } use @medi ...
- css3 响应式布局 Media Query
1.什么是响应式布局? 响应式布局是Ethan Marcotte在2010年5月份提出的一个概念,简单说就是一个网站能够兼容多个终端. 2.响应式布局的优缺点? 优点:面对不同分辨率设备灵活性强,快捷 ...
- 利用media query写响应式布局
最近才接触到响应式布局的概念,之前用到的bootstrap就是一种响应式布局的框架.学习的时候参考了http://blog.csdn.net/shoyer/article/details/829301 ...
- 六、使用media实现响应式布局
常见写法: 下面总结常见的响应式布局的分类: @media screen and (max-width:320px){ #talkFooter .editArea{…… } } @media scre ...
随机推荐
- 前端笔记 （3.JavaScript 2）
一般来说,js代码越来越庞大的时候,最好要把它存在一个js文件中, 通过src引入即可,这样具有维护性高,可缓存(加载一次,无需加载) 方便未来拓展的特性 正确写法: <script type= ...
- Linux命令--1
之前一直在学习Linux,不过有点一天打鱼两天晒网的意味,现在希望通过写博客的形式,积累更多的知识,也希望可以帮到同在linux坑中的各位小伙伴们~ PS:我的笔记重点在于通俗,很多命令一百度就有,但 ...
- JavaBasic_05
方法 简述:实现特定功能的代码块 格式 修饰符: 返回值类型 方法名(参数类型 参数名1,参数类型 参数名2…){ 函数体; return 返回值;} 方法格式 ...
- jquery实现拖拽进度条并显示百分比的特效
#box{position: relative; width: 200px; height: 50px; border: 1px solid #eee; margin: 50px auto 0;} # ...
- chmod、chown、umask、lsattr/chattr
1.chmod 命令 改变文件权限 文件对于使用者来说,有 读 .写 .执行 (当然,还有删除),而这里主要说的是,读写执行(rwx) r w x 对应的是 读写执行,也对应 : 4 ...
- python3.x 正则表达式的应用
正则表达式是我认为比较难的一个东西,今天忽然又学到了这个,想到写下来,以后作为参考手册使用. python如果想使用python需要引用re方法,在文件开始进行引用. import re 接下来说一下 ...
- vim 自动注释
开启了自动注释和自动缩进对粘帖代码不方便 关闭自动注释 :set fo-=r 关闭自动缩进(这个对C/C++代码好像无效) :set noautoindent 关闭C语言缩进 :set noc ...
- Cassandra--JAVA访问Cassandra数据
JAVA创建Cluster对象 cluster = Cluster.builder() .addContactPoints(contactPoints) .withRetryPolicy(new Lo ...
- kustomize 模版自由的配置&&自定义kubernetes工具
kustomize 是一个可以方便我们基于模版配置,自定义kubernetes 的工具,类似kompose,但是个人觉得kompose 更灵活点,而且使用上更方便 安装 mac brew instal ...
- What are User and Group Permissions
https://www.linode.com/docs/tools-reference/linux-users-and-groups/ What are User and Group Permissi ...