4-3编程练习 书写是否正确?为什么我的效果与练习效果有出入?

4-3编程练习 书写是否正确?为什么我的效果与练习效果有出入?

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title>文本样式</title>

        <style type="text/css">

           /*写出CSS样式*/

           div{background-color:#eee;text-align:center;font-size:200%;line-height:500%;}

           .one{font-size:200%;}

           .two{color:red;text-decoration:underline;text-transform:capitalize;}

        </style>

    </head>

    <body>

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

          <div>

              <p>

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

          <span class="one">CSS层叠样式表</span><span class="two">(Cascading Stvle Shccts)</span>

          </p>

          </div>

    </body>

</html>


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

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

2回答
好帮手慕夭夭 2018-09-21 19:12:32

同学描述的点是浏览器自身的解析问题哦 , 代码是没有问题的 . 但是效果图如果不设置vertical-align:middle; 是无法居中的呢 ,如下

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

设置vertical-align:middle; 居中效果如下 :

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

建议同学参考"慕慕9053156"同学的建议设置居中哦. 

希望解答了你的疑惑 , 祝学习愉快 ,望采纳

好帮手慕美 2018-09-19 18:15:24

练习效果中第一段文字较图片是垂直居中的,英文较第一段文字也是垂直居中的,
可以在相应属性样式后添加vertical-align: middle;

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

  • 提问者 sunflower426 #1
    你好,但是我不添加vertical-align属性也达到了效果图 只是效果图的第二段文字括号外有.
    2018-09-21 17:21:58
问题已解决,确定采纳
还有疑问,暂不采纳

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

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

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

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

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

在线咨询

领取优惠

免费试听

领取大纲

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