前端背诵之web

<!-- web移动端 -->
移动端只需要设置百分比的宽度，防止图片时图片也需要设置宽高

    移动端常见浏览器:UC浏览器、QQ浏览器、百度、360安全浏览器、谷歌、搜狗、猎豹等
    1.视口(viewport):布局视口、视觉视口、理想视口
    布局视口(layout viewport)
    视觉视口(visual viewpoint)
    理想视口(ideal viewpoint){
    <meta name="viewport"
        content="width=device-width,user-scalable=no,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0">

    2.物理像素:分辨率
    3.二倍图:(解决图片模糊问题，让背景图片比盒子大一半）
    4.规定背景图的尺寸:background-size:宽度,高度/cover/contain;

    5.在新增c3模型中考虑兼容性问题在属性前加-webkit-
    -webkit-box-sizing:transparent;
    -webkit-tap-highlight-color:transparent;(去掉a背景蓝色)
    -webkit-appearance:none;(不用默认的外观，一半是按钮)
    img,a {-webkit-touch-callout:none;}(禁止页面弹出菜单)

    5.移动端开发:
    移动端页面:流式布局、flex弹性布局、less+rem+媒体布局、混合布局
    响应式页面:媒体查询、bootstarp
    一、流式布局(百分比布局)
    设定{
        max-width:980px;
        min-width:320px;
    }