bootstrap的一些API认识以及应用和回到顶部按钮的实现 week15学习

本文详细介绍了Bootstrap的网格系统,包括其实现原理、格式、列偏移、列排序和列的嵌套。重点讲解了如何利用网格系统进行页面布局排版,以及如何通过设置负值外距和列偏移实现列间距。此外,还提及了Bootstrap框架中列方向的调整和列的嵌套技巧。
摘要由CSDN通过智能技术生成
这周的很多时间是花在了bootstrap上,把慕课网的基础教学部分看完了,然后看了一下有响应式的部分以及简单看了一下回到顶部按钮是怎么实现的。
基础部分讲的都是一些API如何应用,如果可以很好地应用,可以用很少的代码实现很好地网页效果。 通过getbootstrap.com官网学习,可以将js,css,fonts等字体文件下载再链接入自己的文件,也可以直接链接目标网址进入文件来实现。当中有很多内容都可以直接引入类名来实现,排版中的标题,文字,对其风格,代码的写入,表格表单,复选框,按钮,下拉菜单,媒体对象等等,仅需将类名引入即可。

觉得其中比较重要的是网格系统,它可以很好地做好页面布局排版。

网格系统------实现原理:

                                        1、数据行(.row)必须包含在容器(.container)中,以便为其赋予合适的对齐方式和内距(padding)。如:

                      <div class="container">
                      <div class="row"></div>
                      </div>

                                        2、在行(.row)中可以添加列(.column),但列数之和不能超过平分的总列数,比如

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值