​产品经理技术脑:bootstrap

author author     2023-04-02     139

关键词:

参考技术A


什么是 Bootstrap?


Bootstrap 是Web 应用程序的前端框架。基于 HTML、CSS、JAVASCRIPT 。


Bootstrap由美国Twitter公司的设计师Mark Otto和Jacob Thornton合作开发的,基于HTML、CSS、JavaScript 的简洁、直观、强悍的前端开发框架,使得 Web 开发更加快捷。


Bootstrap提供了优雅的HTML和CSS规范,由动态CSS语言Less写成,一直是GitHub上的热门开源项目。


Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架。在现在的 Web 开发中,有几个几乎所有的 Web 项目中都需要的组件。



Bootstrap版本功能发展


Bootstrap 与最新版的 Google Chrome、Firefox、Internet Explorer、Opera 和 Safari 浏览器兼容,尽管有些浏览器并不是支持所有操作系统。


从 2.0 版本开始,Bootstrap 支持响应式网页设计(RWD)。页面布局可以根据显示网页的设备(桌面、平板电脑、手机)来进行动态调整。


3.0 版本开始,Bootstrap 将移动设备优先作为设计方针,更加强调了响应式设计。


4.0 alpha 版本添加 Sass 和 Flexbox 的支持。



Bootstrap特点


Bootstrap非常流行,得益于它非常实用的功能和特点。主要核心功能特点如下:


l跨设备、跨浏览器

可以兼容所有现代浏览器,包括比较诟病的IE7、8。当然,本课程不再考虑IE9以下浏览器。


l响应式布局

不但可以支持PC端的各种分辨率的显示,还支持移动端PAD、手机等屏幕的响应式切换显示。


l提供的全面的组件

Bootstrap提供了实用性很强的组件,包括:导航、标签、工具条、按钮等一系列组件,方便开发者调用。


l内置jQuery插件

Bootstrap提供了很多实用性的jquery插件,这些插件方便开发者实现Web中各种常规特效。


l支持HTML5、CSS3

HTML5语义化标签和CSS3属性,都得到很好的支持。


l支持LESS动态样式

LESS使用变量、嵌套、操作混合编码,编写更快、更灵活的CSS。它和Bootstrap能很好的配合开发。



Bootstrap基本内容与组件



Bootstrap 包括 HTML、CSS 及 JavaScript 的框架,提供字体排印、窗体、按钮、导航及其他各种组件及 Javascript 扩展。主要包含内容有:


l 基本结构 : Bootstrap 提供了一个带有网格系统、链接样式、背景的基本结构。

l 全局CSS样式 : Bootstrap 自带以下特性:全局的 CSS设置、定义基本的 HTML 元素样式、可扩展的 class,以及一个先进的网格系统。

l 组件 : Bootstrap 包含了十几个可重用的组件,用于创建图像、下拉菜单、导航、警告框、弹出框等等。

l JavaScript 插件 :Bootstrap包含了十几个自定义的jQuery 插件。您可以直接包含所有的插件,也可以逐个包含这些插件。

l 定制 :您可以定制Bootstrap的组件、LESS 变量和jQuery 插件来得到您自己的版本。

lBootstrap全局Css样式包括

Grid

Typography

Tables

Forms

Buttons

Responsiveness。


l还有大量其他有用的前端组件,比如:

Dropdowns

Navigation

Modals

Typehead

Pagination

Carousal

Breadcrumb

Tab

Thumbnails

Headers



Bootstrap资源


l参考资料

Bootstrap官网

http://getbootstrap.com


Bootstrap中文网

http://www.bootcss.com


网站使用案例

http://expo.bootcss.com/


Github

https://github.com/twbs/bootstrap


l教程

Bootstrap菜鸟教程

http://www.runoob.com/bootstrap/bootstrap-tutorial.html


Bootstrap on W3Schools

http://www.w3schools.com/bootstrap


慕课网视频教程

http://www.imooc.com/course/list?c=bootstrap


l模版

Bootstrap免费模版

http://startbootstrap.com


模糊效果后台模版

http://akveo.github.io/blur-admin/


后台模版

https://colorlib.com/polygon/gentelella/index.html


仪表盘

http://keen.github.io/dashboards/


l主题

Flat-ui

http://designmodo.com/flat-free/


各种配色主题

https://bootswatch.com/


基于bootstrap的主题框架

http://bootflat.github.io


l实用工具

实用代码片段

http://bootsnipp.com/ 提供一些有用的在线工具和代码片段

b端产品经理必问面试问题及答案

↑↑↑点击上方关注【B端产品经理面试问题及答案】,我会一直给你分享B端产品经理面试问题及答案​你好,我是B端产品经理面试官Aadi,任职某大厂,11年面试官,10年产品经理,​我是站在面试官角度,只告诉你拿来即用的... 查看详情

干货|产品经理如何画脑图

...将每个页面对应的功能通过脑图的方式梳理,再把自己的产品进行脑图梳理后,做对比,观察哪些功能是我们有的,他们没有的。哪些功能,我们可以借鉴他们的。工作中的会议纪要,我 查看详情

产品程序员如何和产品经理沟通01——产品经理的能力模型

简介 作为一只从技术转向产品的程序猿,和大家分享一下产品经理的一些要素。一方面给各位程序猿参考一下,所谓知己知彼,方便以后和产品汪们优雅地撕逼;另一方面,如果有想从技术转产品的程序猿也可以作为参考。... 查看详情

[项目管理-18]:项目实施中,项目经理产品经理运营经理设计经理技术经理工程经理不同角色的比较

...;https://blog.csdn.net/HiWangWenBing/article/details/126681213目录第1章产品什么周期1.1产品研发与运维1.3DevOps(开发运营一体化)1.4产品生命周 查看详情

刚入门的产品经理画产品原型图,都有哪些好用的工具,求安利

首选建议不要直接用Axure,推荐国内80%产品经理都在用的墨刀,是在线原型设计工具,很多模板都可以直接复用,分享便捷,易上手操作很简单。一是Axure对于新入门产品经理而言,Axure功能确实很多,但是对于初级而言主要是能... 查看详情

作为产品经理,你需要肩负起这些责任

希望所有的产品经理都明白产品具有无限大的责任。 产品经理在工作中的责任边界是无效大的。为什么会这么说?因为要使一个产品体现出价值,仅仅靠自己的能力不足以支撑,所以需要依靠技术与运营。但是产品经理最大... 查看详情

总结整理租房产品创业的三个方向和三个产品---摘自《人人都是产品经理》

创业产品反思录:从拆解元需求到产品定位人人都是产品经理社区  发布于2018-10-0808:56:31 举报阅读数:466??10个人,10个月,100万,3款产品,我们在变幻莫测的租房领域做了一些探索,犯了很多错误,也学到一些经验... 查看详情

写给产品经理的技术书:客户端服务端和交互相关技术

产品经理有三大领域的技术是需要去攻克的,分别是:客户端相关技术、服务端相关技术、交互相关技术一、客户端相关技术1.iOS和安卓产品差异1.1应用的设备不同:IOS和安卓最大的区别在于本身所应用的设备不同。IOS系统主... 查看详情

作为产品经理,如何有效应对需求变动和技术开发?

创业公司所要求的是快速迭代产品,从而找到精准用户,进而开始谋取商业利益,这是一个非常简单且容易理解的流程(实际上情况要复杂的多),那么便来说说这第一步的操作,在迭代产 品的过程中 产品经理 如... 查看详情

学习产品经理第一天~

什么是产品经理?1.产品经理就是企业中专门负责产品管理的职位,产品经理负责调查并根据用户的需求,确定开发何种产品,选择何种技术、商业模式等。并推动相应产品的开发组织,他还要根据产品的生命周期,协调研发、... 查看详情

ui设计师做好这几点,产品经理准闭嘴

产品经理都有一项极其重要的技能,就是要耐撕,已在长期的撕逼大战中练就了一身的本领,口号是这样的:老板撕,老板撕,老板撕完技术撕,技术撕技术撕,技术撕完设计撕,设计撕设计设计撕,设计撕的话...撕不过产品。... 查看详情

2016第51周五产品经理的十大错误

错误1:将用户需求混淆为产品需求 大部分产品经理的工作流程是:收集完用户需求,开始编写产品需求文档,然后交给技术人员开发,接下来跟踪项目进度,协调资源,验收成果,最后发布产品。 整个流程没有错,容... 查看详情

写给产品经理之前端是如何展示后端数据的

...两年更是移动开发程序员的春天。今天的互联网上充斥着产品与技术的撕逼。也许你会问产品经理到底要不要懂技术?由此引申出,产品经理到底要不要懂设计?产品经理到底要不要懂运营?产品经理到底要不要懂市场?产品经... 查看详情

面向b端的产品经理

简评:越来越多人涌入产品经理这个岗位,但是面对不同的产品和客户群体,产品经理所需要的技能、知识和经验可能大相庭径。近几年随着移动互联网的爆发性增长,几乎遍地都是产品经理了。华尔街日报也曾报道称「产品经... 查看详情

产品经理如何构建优质人脉圈

去年前同事A跟随某技术大佬一起跳到某门户站做产品负责人,最近又跟随这位技术大佬创业去做区块链项目。两年前这位前同事A还是客户端某基层产品经理,不到两年时间,先后作了产品负责人和产品联合创始人。这自然与其... 查看详情

入门人人都是产品经理?—浅谈互联网中的产品经理

苏杰先生写了一本非常著名的书——《人人都是产品经理》,几乎成为了每个刚入门或者想入门产品经理的小萌新们的圣经,同时也让产品经理这一工种成为互联网众人热捧的对象,经常听到有销售转产品、技术转产品、... 查看详情

产品经理具体是做什么的?

 什么是产品经理?产品经理,是企业中专门负责产品管理的职位,产品经理负责市场调查并根据用户的需求,确定开发何种产品,选择何种技术、商业模式等。并推动相应产品的开发组织,他还要根据产品的生命周期,协调... 查看详情

程序员可以转产品经理吗

程序员可以转产品经理吗  产品经理跟程序员是不一样的,产品经理只需要懂一点,不需要多厉害,应届生都是可以当产品经理的。而程序员强调编程技能,专业技术,语言功底,懂不懂操作系统这些;产品经理强调沟通... 查看详情