老师还能让P标签顶上到无缝吗,感觉很怪异,达不到原图标准。

老师还能让P标签顶上到无缝吗,感觉很怪异,达不到原图标准。

<html>

<head>

        <!-- 此处编写样式 -->

        <style type="text/css">

            #div1{

                float:left;

            }

            #a,#b,#c,#e,#f,#g{float:left;

               

            }

            #aa{float:left;}

            #div2{

                float:left;

                

            }

            img{

                border:1px;

                width:80px;

                padding:1px;

                margin:1px;

            }

            p{border:0.5px solid silver;

            width:80px;

            font-size:0.2px;

            /*text-align:bottom;*/

            margin:-2px;

            padding:-1px;


            line-height:1em;

            

            }



        </style>

</head>

<body>   

        <!-- 此处写代码 --> 

        <div id="aa">

        <div id="div1">

            <div id="a">

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

                 <p>欢迎来慕课网学习新知识!</p>

            </div>

            <!--<p>欢迎来慕课网学习新知识!</p>-->

           

             <div id="b"><img src="http://img1.sycdn.imooc.com/climg//590fe97d00011bda02400135.jpg">

             <p>欢迎来慕课网学习新知识!</p>

             </div>

             <!--<p>欢迎来慕课网学习新知识!</p>-->

              <div id="c"><img src="http://img1.sycdn.imooc.com/climg//590fe982000150ba02400135.jpg">

              <p>欢迎来慕课网学习新知识!</p>

              </div>

              <!--<p>欢迎来慕课网学习新知识!</p>-->

        </div>

        <div id="div2">

            <div id="e"><img src="http://img1.sycdn.imooc.com/climg//590fe9770001e63102400135.jpg">

            <p>欢迎来慕课网学习新知识!</p>

            </div>

            <!--<p>欢迎来慕课网学习新知识!</p>-->

             <div id="f"><div id="b"><img src="http://img1.sycdn.imooc.com/climg//590fe97d00011bda02400135.jpg">

             <p>欢迎来慕课网学习新知识!</p>

             </div>

             <!--<p>欢迎来慕课网学习新知识!</p>-->

              <div id="g"><img src="http://img1.sycdn.imooc.com/climg//590fe982000150ba02400135.jpg">

              <p>欢迎来慕课网学习新知识!</p>

              </div>

              <!--<p>欢迎来慕课网学习新知识!</p>-->

        </div>

        </div>

        

</body>

</html>

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

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

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

1回答
好帮手慕美 2019-10-30 11:16:08

同学,你好。

1、p标签默认是有margin外边距的,同学可以在css样式开始位置设置所有标签的margin为0

例:

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

设置样式后:

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

2、同学img标签设置了margin为1px,因此p标签和img标签间也是会的间距的

如果我的回答解决了您的疑惑,请采纳!祝学习愉快~~~~

  • 提问者 qq_阳光_134 #1
    设置0了也顶不上去0.0
    2019-10-30 19:07:34
  • 好帮手慕美 回复 提问者 qq_阳光_134 #2
    同学,你好。同学可以看下产生间距的原因,img标签设置了margin和padding在显示效果上也会使用图片与文字间有空隙。同学可以将img和p标签设置的margin外边距,padding内边距设置为0即可。同学可以在页面的调试模式中选中相应的标签看下间距产生的原因。祝学习愉快~~~~
    2019-10-31 09:48:29
问题已解决,确定采纳
还有疑问,暂不采纳

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

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

0 星
3.从网页搭建入门Python Web
  • 参与学习           人
  • 提交作业       218    份
  • 解答问题       3562    个

本阶段带你用Python开发一个网站,学习主流框架Django+Flask是Python Web开发的第一步,在基础知识上实现积分商城的项目开发,体验真实的项目开发流程,提高解决编程问题和效率的能力。

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

在线咨询

领取优惠

免费试听

领取大纲

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