3回答

• 

  慕侠2155777

  2018-12-26 16:38:07

  应该是你的图高度设置和a标签高度一样，所以宽度150 高度13  

  举个例子

  <a href="javascript:;">

  <img src="img" />

  </a>

  a{

  width:150px

  height:13px

  position: relative;

  }

  a img{

  width:100% // 这里高度不要设置，图片高度会自动比例，然后使用绝对定位

  position:absolute

  bottom:50px// hover后设置13px  因为a的高度是13px

  }

  至于第二个问题

  Ctrl层的高度还是13px  无论子元素多大。你在Ctrl层同级别的地方写东西，你会发现写的东西确实位于Ctrl层外面，但是会被Ctrl层里面多出的内容遮盖住，会影响布局，所以一般来说如果内容是图片或者文字，正常布局应该使用padding来控制你期待的边距。这里a标签当做按钮来设置样式，而且中间没有文字，所以13px加背景只是为了布局美观协调，等你真正设计网页的时候你会发现，很多时候高度和宽度不能随意设置，特别是响应式布局

  就拿这个例子来说，浏览器窗口变动时，样式会大不相同，最好的方法就是a标签宽度用100%（js控制，根据图片的多少来设置合适的百分比），现在主要学习的是这个设计逻辑

  
  

  
  

  0 0
• 

  慕圣9983511

  2018-02-02 21:52:46

  检查代码的时候我发现这个img标签让我打多了一个height=“13px”，难怪了，但是我还是有一个疑问，为什么默认情况下它不跟随它所在层的大小呢，现在这个Ctrl层中的img元素大于它的高度了，那么这个Ctrl层的高度还是13px吗？

  0 1
• 

  慕圣9983511

  2018-02-02 21:43:44

  我通过调整定位，令缩略图位置在上方了，但是我的预览图和层Ctrl高度一样了，显得很扁平，怎么办呢？

  0 1