为什么图片不能居中

为什么图片不能居中

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title>文本样式</title>

        <style type="text/css">

           /*写出CSS样式*/

           p{height:100px;background-color:#eee;font-size:2em;font-height:2em;text-align:center;}

           .text{vertical-align:middle;}

           .css{font-size:2em;vertical-align:middle;}

           .letter{color:red;text-decoration:underline;vertical-align:middle;}

        </style>

    </head>

    <body>

          <!--写出html代码-->

          <p><span class="text"><img src="http://img1.sycdn.imooc.com/climg//59c21bae000157fa01000059.jpg"/>&nbsp;</span><span class = "css">CSS层叠样式表</span><span class="letter">&nbsp;(Cascading Style Sheets)</span></p>

    </body>

</html>


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

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

1回答
好帮手慕夭夭 2018-08-17 15:43:20

代码中如下样式并不存在 ,是错误的 ,

http://img1.sycdn.imooc.com//climg/5b767c0a0001264e01640044.jpg

同学是想实现line-height还是font-weight或者是别的呢 ,其实没有不需要设置的哦 ,直接去掉 .

而图片的父元素span设置的居中 ,如下 :

http://img1.sycdn.imooc.com//climg/5b767b8a0001dc0303000151.jpg

所以span标签是居中了 ,但是图片特殊 ,不会跟着它居中显示的 , 建议去掉span ,并为图片设置如下 :

http://img1.sycdn.imooc.com//climg/5b767c880001a1bf05000098.jpg

完善一下吧, 祝学习愉快 ,望采纳

  • 提问者 喵喵音音 #1
    你好 我不太明白呢个element.style是什么意思?
    2018-08-17 15:48:28
  • 好帮手慕夭夭 回复 提问者 喵喵音音 #2
    你好 element.style 是元素的样式 , 这是在浏览器中设置的 ,同学在css中直接给图片img设置居中即可
    2018-08-17 16:03:36
问题已解决,确定采纳
还有疑问,暂不采纳

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

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

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

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

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

在线咨询

领取优惠

免费试听

领取大纲

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