在谷歌里图片宽度成100%没有占满一行。

在谷歌里图片宽度成100%没有占满一行。

<!DOCTYPE html>

<html>

<head>

  <meta charset="UTF-8">

  <title></title>

  <style type="text/css">

  *{margin: 0;padding:0}

   .header{

       width:100%;

       height:100px;http://img1.sycdn.imooc.com/climg//598d59800001372219201040.jpg

       background-color:black;

       position:fixed;}

       

       ul{

        float:right;

       height: 100px;

       }

       li{ 

           float:left;

           color:orange;

           font-size:20px;

           line-height:100px;

           list-style:none;

           margin-left:25px;

           margin-right: 25px;

       }

       .list1{

        width:100%;

        height:auto;

        padding-top:100px

       }

       

  </style>

</head>

<body>

 <div class="header">

     <img src="http://img1.sycdn.imooc.com/climg//58c0d2d900016ce303000100.png"/>

     <ul>

           <li>课程</li>

           <li>职业路径</li>

           <li>实战</li>

           <li>猿问</li>

           <li>手记</li>

     </ul>

 </div>

 <div class=list1>

  <img src="http://img1.sycdn.imooc.com/climg//58c0eda50001e12416000480.jpg" />

 </div>

 <div class=list2>

  <img src="http://img1.sycdn.imooc.com/climg//58c0edb80001c9f216000480.jpg" />

 </div>

 <div class=list3>

  <img src="http://img1.sycdn.imooc.com/climg//58c0edc9000100d516000480.jpg" />

 </div>

 

</body>

</html>


正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

4回答
怎么都被占用了呢 2017-08-12 15:52:49

http://img1.sycdn.imooc.com/climg//598eb3ce00015ae003670084.jpg在css中设置

小丸子爱吃菜 2017-08-11 19:10:11

如果是写在标签里面的话是:width="100%",如果是写在样式表中的话是:width:100%

小丸子爱吃菜 2017-08-11 15:42:51

以浏览器的显示效果为准~毕竟编程题的显示界面宽度没有浏览器宽度大!

给图片设置width:100%;就可以实现铺满页面的效果了!

祝学习愉快!

  • <img src="http://img1.sycdn.imooc.com/climg//58c0edc9000100d516000480.jpg" width:100%; /> 请问是这样设置吗? 没变啊
    2017-08-11 19:06:36
提问者 越自律_越自信_越自由 2017-08-11 15:29:30

但是我用谷歌在做网上作业的那个界面又是全屏。为什么呢?如果什么兼容的问题,但是是同一个浏览器啊http://img1.sycdn.imooc.com/climg//598d5cd70001899819201040.jpg

问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
前端小白入门系列课程
  • 参与学习           人
  • 提交作业       11218    份
  • 解答问题       36713    个

从一个不会编程的小白到一个老司机是需要过程的,首先得入门,学习基础知识,然后才能进阶,最后再到精通,本专题是你走进前端世界的不二选择!

了解课程
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师