当前位置:Gxlcms > css > CSS调节图片的大小,要知道width、height

CSS调节图片的大小,要知道width、height

时间:2021-07-01 10:21:17 帮助过:97人阅读

今天学习的内容是教大家如何用css调整图片的大小,在之前的课程例子中,我们接触了width和height这两个属性,这两个属性分别是用来设置元素的宽度和高度的。
在CSS中,对于图片的大小,我们也是用width和height来定义。语法:

CSS调节图片的大小,要知道width、height

说明:在CSS初学阶段,全部都是使用像素作单位,在CSS进阶阶段我们会深入讲解其他CSS单位举例:

  1. <!DOCTYPE html>
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <title></title>
  5. <style type="text/css">
  6. img{width:60px;height:60px;}
  7. </style>
  8. </head>
  9. <body>
  10. <img src="../App_images/lesson/run_cj/cartoongirl.gif" alt=""/>
  11. </body>
  12. </html>

在浏览器预览效果如下:

CSS调节图片的大小,要知道width、height

分析:不管图片的实际大小是多少,你都可以使用width和height来定义你想要的高度和宽度。大家别傻乎乎的还用PS做好高度和宽度才敢把那张图片用到页面上。

更多CSS调节图片的大小,要知道width、height相关文章请关注PHP中文网!

人气教程排行