• 人民网评:异地医保的步子还需更大一些 2019-07-18
  • 敢想敢拼的邹市明:用奥运精神助推青少年体育事业发展 2019-07-13
  • 改革开放40年——从全国糖酒会看酒业跌宕起伏酒业 中国 2019-07-13
  • 这三个史无前例,让美国有点懵了 2019-07-11
  • 文创大咖齐聚成都 共话“一带一路”文化交流 2019-07-06
  • 农历五月初二 唐代高僧雪峰义存禅师圆寂纪念日 2019-07-06
  • 山西与腾讯公司签署战略合作协议 2019-07-04
  • 山西:“四好农村路” 致富添门路 2019-07-02
  • 【专题】社会主义核心价值观主题微电影优秀作品展示 2019-07-02
  • 《钟馗捉妖记》杨旭文为魔族惨烈“献身” 2019-06-10
  • 个税法迎第七次大修 起征点由每月3500元提高至5000元 2019-06-10
  • 摄影师捕捉超强EF3龙卷风 巨大云团画面惊险壮观 2019-05-26
  • 农民夜校成十九大精神宣讲重要课堂 2019-05-25
  • 拆迁款分配引冲突 儿子推倒八旬老父致其死亡 2019-05-25
  • 2017年邵逸夫奖在港颁奖 5位科学家获此殊荣 2019-05-23
  • 代理加盟 2019全新代理计划 赚钱+省钱双管齐下,独立平台,丰厚利润!

    您现在的位置: 11选5任四包赚不赔40注 > 站长学院 > 建站教程 >

    11选5任八最保本买法:网站自适应布局JS控制图片高度等于宽度

    来源:未知 发布时间:2019-03-30热度: ℃我要评论
    PC和WAP端自适应布局对用户体验非常好,由于两个平台的URL只有一个,不存在权重分散的情况。设计起来表面复杂,其实比设计两个不同的模板更简单些,风格一般简洁大气。如果两个样式差异太大,还是应该选择分开设计。 网站自适应比较难处理的是图片,一般图片CSS用百分...

    11选5任四包赚不赔40注 www.zo-n.com

           PC和WAP端自适应布局对用户体验非常好,由于两个平台的URL只有一个,不存在权重分散的情况。设计起来表面复杂,其实比设计两个不同的模板更简单些,风格一般简洁大气。如果两个样式差异太大,还是应该选择分开设计。

    自适应布局图片高度等于宽度

           网站自适应比较难处理的是图片,一般图片CSS用百分比来控制,比如

    <ul class="imgbox">
     <li><a href='#'><img src="//www.vi586.com/images/1.jpg"></a></li>
     <li><a href='#'><img src="//www.vi586.com/images/2.jpg"></a></li>
    </ul>

    css样式选择器写法

    @media screen and (判断属性){
    css样式
    }

          不过多解释, 看案例:

    <style>
    /*屏幕(浏览器)不小于1201px的样式*/
    @media screen and (min-width:1201px){
    .imgbox li{float:left;width:50%;height:auto}
    }
    /*屏幕(浏览器)不大于1200px的样式*/
    @media screen and (max-width:1200px){
    .imgbox li{float:none;width:100%;height:auto}
    }
    </style>
    

           以适应不同的设备访问,但宽度和高度都变自适应后,如果每张图片宽高不一样,排版就会出现错乱,一般以最高的那张图为下一张图的起点,出现空白。只能通过JS控制高度。比如高度等于宽度:先引用jquery,自己下一个。在</head>或</body>前添加代码

    <script type="text/javascript">$(document).ready(function(){$('.imgbox img').css('height',$('.imgbox img').css('width'));})</script>

    本文地址://www.zo-n.com/news/1365.html

      发表评论

      评论列表(条)

      • 人民网评:异地医保的步子还需更大一些 2019-07-18
      • 敢想敢拼的邹市明:用奥运精神助推青少年体育事业发展 2019-07-13
      • 改革开放40年——从全国糖酒会看酒业跌宕起伏酒业 中国 2019-07-13
      • 这三个史无前例,让美国有点懵了 2019-07-11
      • 文创大咖齐聚成都 共话“一带一路”文化交流 2019-07-06
      • 农历五月初二 唐代高僧雪峰义存禅师圆寂纪念日 2019-07-06
      • 山西与腾讯公司签署战略合作协议 2019-07-04
      • 山西:“四好农村路” 致富添门路 2019-07-02
      • 【专题】社会主义核心价值观主题微电影优秀作品展示 2019-07-02
      • 《钟馗捉妖记》杨旭文为魔族惨烈“献身” 2019-06-10
      • 个税法迎第七次大修 起征点由每月3500元提高至5000元 2019-06-10
      • 摄影师捕捉超强EF3龙卷风 巨大云团画面惊险壮观 2019-05-26
      • 农民夜校成十九大精神宣讲重要课堂 2019-05-25
      • 拆迁款分配引冲突 儿子推倒八旬老父致其死亡 2019-05-25
      • 2017年邵逸夫奖在港颁奖 5位科学家获此殊荣 2019-05-23
      • 七乐彩走势图连线带坐标 网上哪里可以投注足球 另版阳光 河北20选5开奖规则 马报白小姐第99期 11选5缩水软件版 快乐飞艇官网下载 歪歪网红球球 王中王刘佰温四肖中特 北京十一选五前三值遗漏 买辽宁11选5用什么软件 2019年136期3d中奖号码 陕西11选5任五 双色球选号软件破解 中国竞彩网胜平负