http://www.maayanl.com

                                                                  【龙虎大战】bootstrap响应式布局图片怎么居中-Bootstrap教程

                                                                  Bootstrap框架来制作响应式网站(或称之为响应式网页排版)真的很方便,特别是对于图片,用一个css[类.img-responsive就可以实现响应(自动随屏幕缩放,姑且这样理解),一行代码就实行了,如同使用html标签一样,不需要考虑逻辑。

                                                                  如下:(推荐学习:Bootstrap视频教程)

                                                                  class=”img-responsive”

                                                                  响应式图片如何居中?

                                                                  图片居中在网页制作中是常常会用到的,那响应式图片要如何居中呢?也很简单,用一个css类.center-block就行了。代码如下:

                                                                  class=”img-responsive center-block”

                                                                  这一行代码让图片响应且居中。so easy!

                                                                  但是问题也会来了!

                                                                  1.那Bootstrap常用的.text-center类行不行(能不能让响应式图片]居中)呢?

                                                                  答案是:通常情况下,.text-center类用于文字居中,对于(非响应式图片,会起作用,而对于响应式图片,则不起作用。

                                                                  2.那.center-block 类换一个位置,会不会影响响应式图片的居中呢?

                                                                  答案是:会的。

                                                                  为什么?

                                                                  不要问那么多。上面标红的代码就是正确标准的。收藏好本页响应式图片居中的核心技巧,网站制作时有需要时,顺手一抄完事。

                                                                  更多Bootstrap相关技术文章,请访问Bootstrap教程栏目进行学习!

                                                                  以上就,是)bootstrap响应式布局图片怎么居中的详细内容,更多请关注php中文网其它相关文章!

                                                                1. 微信
                                                                2. 分享php中文网最新课程二维码相关标签:bootstrap
                                                                3. 本文原创发布php中文网
                                                                4. 郑重声明:本文版权归原作者所有,转载文章仅为传播更多信息之目的,如作者信息标记有误,请第一时间联系我们修改或删除,多谢。

                                                                  上一篇:洛阳图书批发市场
                                                                  下一篇:没有了