W3CSchool编程实战练习——Bootstrap框架

自己留着看。

Bootstrap会自动获取使用者屏幕的大小,并根据屏幕的大小自动调整HTML元素的宽度和高度来适配屏幕,因此称之为--响应式布局。

通过响应式布局,你不再需要为你的Web站点重新设计一个手机版的页面,Bootstrap会自动帮你调整好在手机页上的页面显示,事实上,Bootstrap在任何宽度的设备上都能适应得很好。

使用Bootstrap也非常简单,你只需要把下面的链接添加到你需要使用Bootstrap来进行布局的应用的头部：

1.在html的最外层加上

2.添加class="img-responsive"，适应屏幕

3.标签添加text-center的class属性,标题文字就可以居中了

4.如果你想是你的button 标签的宽度充满整个屏幕,你可以使用btn-block这个class讲按钮升级为块级元素,使button标签的宽度充满整个屏幕,并且该元素后面的所有元素都会浮动到下一行。

5.btn-primary类是该应用的主要颜色类，这个类的颜色对于那些你希望高亮提示用户的操作上非常有用。

6.

 标签中让按钮并列排列,然后把按钮嵌进

 中,设置按钮占用的列宽。

Like

Info

Delete

7.添加Font Awesome到任何应用程序，只需将下面的链接添加到你的HTML顶部就可以了：

8.