zoukankan      html  css  js  c++  java
  • 【html】响应式css

    1.必须引入标签:
    设置 meta 标签

        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    
    

    在设置视口时需要注意,视口就是网页可见区域的尺寸,设置视口时只设置宽度就行,不用在乎高度,具体高度由网页内容自动撑开。上面 meta 标签中内容的含义如下:

    • viewport:即视口,表示网页的可视区域;
    • width:控制 viewport 的大小,可以指定一个具体的值,例如 600,也可以是由关键字组成的特殊值,例如 device-width 就表示设备的宽度;
    • initial-scale:表示初始缩放比例,也就是页面第一次加载时的缩放比例;
    • maximum-scale:表示允许用户缩放的最大比例,范围从 0 到 10.0;
    • minimum-scale:表示允许用户缩放到最小比例,范围从 0 到 10.0;
    • user-scalable:表示用户是否可以手动缩放,“yes”表示允许缩放,“no”表示禁止缩放。

    2.编写新的css样式(满足条件时,使用新得css):

    // 屏幕尺寸小于480px使用的样式
    @media screen and (max- 480px) {
        body {
            background-color: lightgreen;
        }
    }
    
  • 相关阅读:
    hdu 1754 线段树 注意线段树节点的设计 求什么,设什么
    hdu 4015 概率题
    poj 1950 回溯
    最大上升子序列
    JVM学习博客
    2012
    i am alone at a crossroads
    易知难
    牢骚。。
    something
  • 原文地址:https://www.cnblogs.com/lisicn/p/15388710.html
Copyright © 2011-2022 走看看