Bootstrap是一种多功能的Web前端开源框架,以LESS项目为基础,由Twitter的内部工程师开发,它为Web应用程序UI提供了一致的框架,通过了解如何使用Bootstrap,开发人员将能够快速完成网站和Web应用程序(包括移动友好型应用程序)的开发,其具有以下几大特点:
(1)跨设备、跨浏览器
(2)内置很多Java 插件和图标
(3)代码简洁、视觉优美,支持HTML5、CSS3和LESS动态样式
(4)响应式布局,可以兼容PC端、PAD以及手机移动端的页面访问
Bootstrap的代码结构包含三大核心目录:css(样式)、js(脚本)和fonts(字体),开发工具一般使用Sublime Text或者Notepad++,而测试工具则包括各类浏览器、Opera Mobile Emulator等。
Bootstrap作为一款优秀的Web页面框架,能够让开发人员不再需要花费太多精力在浏览器兼容问题上,同时,通过创建单一的框架来提供WEB页面设计中常见的元素,既能避免网页开发经常需要使用到各类不同组件的麻烦,还保持了合理的灵活性。
Bootstrap是目前GitHub软件库中最受欢迎的项目,同时也受到了个人、小型团队以及大型组织的关注。Bootstrap不仅包含了基本的CSS元素,还以LESS项目为基础,对CSS语言进行了增强,让排印、表单、按钮、表格、网格、导航、警告等网页功能的实现变得不再复杂。另一方面,Bootstrap的学习门槛也不高,只需要掌握了基础的HTML和CSS应用知识,就能开始好好体验一番Bootstrap的魔力了。
一、排版样式
Bootstrap提供了一些常规设计好的页面排版样式供开发者使用,包括了标题、页面主体、对齐、列表等常规内容,如在h1~h6元素之间嵌入small元素,通过Firebug查看,可以发现h1~h3下small元素的大小只占父元素的65%,而h4~h6下small元素的大小只占父元素的75%。
二、表格和按钮
Bootstrap提供了一些丰富的表格样式供开发者使用,用以实现各式各样的表格和按钮功能,通过内置的CSS定义,实现多种效果的显示。
三、表单和图片
除了基本的表单样式,Bootstrap还提供内联表单、表单合组、水平排列、复选框和单选框、下拉列表、校验状态、额外图标等多种选择,满足了不同开发者的需求。
四、栅格系统
Bootstrap提供了一套响应式、移动设备优先的流式栅格系统,通过完成屏幕和设备等宽、是否运行用户缩放、缩放比例等设置,就能实现不同屏幕大小的自适应效果。在栅格系统中,是通过一系列的行(row)与列(column)的组合来创建页面布局的,浏览器会随着屏幕大小的增减自动分配最多12 列,其中,内层.container 容器的自适应宽度为:自动、750px(小屏幕平板)、970px(桌面显示器) 和1170px(大桌面显示器)。
四、导航组件
Bootstrap提供了一组导航组件,用于实现Web页面的栏目操作,其中,导航条是网站中作为导航页头的响应式基础组件,这些组件都依赖于同一个.nav类,状态类也是共用的,通过改变修饰类就能够改变样式。
对于很大一部分擅长于代码和数据的开发人员来讲,毫无疑问Bootstrap是一个极其宝贵的工具,有了Bootstrap,就能够在Web项目中把更多的关注点放到基本代码和数据中,而不是视觉和其他感官设计。Bootstrap的响应式布局让它可以兼容PC端和手机设备端的页面访问,其附带的库包含了大量的按钮样式、导航样式和其他可重用工具。总而言之,Bootstrap尤其适用于将思想的闪光点快速转变为 Web项目,本文对Bootsrap的特性和应用进行了简要的介绍,其精髓当然不仅仅局限于此,读者们如果有兴趣的话,相信能够探索到Bootsrap更多有趣的地方。
2、本站永久网址:https://www.yuanmacun.com
3、本网站的文章部分内容可能来源于网络,仅供大家学习与参考,如有侵权,请联系站长进行删除处理。
4、本站一切资源不代表本站立场,并不代表本站赞同其观点和对其真实性负责。
5、本站一律禁止以任何方式发布或转载任何违法的相关信息,访客发现请向站长举报
6、本站资源大多存储在云盘,如发现链接失效,请联系我们我们会第一时间更新。
源码村资源网 » 网页设计有什么框架(网页设计基本框架)
1 评论