Bootstrap是由Twitter推出的一个用于前端开发的开源工具包，由Twitter的设计师Mark Otto和Jacob Thornton合作开发，是一套简洁直观、功能强悍的前端开发框架，可以编写灵活、稳定、高质量的HTML和CSS代码，使web开发变得更加迅速和简单。
如果您的wordpress网站想做成自适应的，使用Bootstrap框架是个不错的选择。
为什么使用Bootstrap？
- 使用简单：Bootstrap 已经搭建好了实现自适应的基础框架，并且非常容易修改。如果你是一个初初学者，Bootstrap能够让你在非常短的时间内上手。
- 兼容性好：所有的主流浏览器都已支持。
- 丰富的组件：Bootstrap 的HTML组件和Js组件非常丰富，而且代码非常简洁，特别易于修改，极大地提升了工作效率。
当然使用Bootstrap并不能帮助您完成所有事情，因为它只是一个的框架，在这个框架的基础上您可以任意的发挥。
如何使用Bootstrap？
Bootstrap框架的结构如下：
2. 引入Bootstrap样式和JS，使用代码如下:
Crayon-5c891d0023e33477205018" class="Crayon-Syntax Crayon-theme-classic Crayon-font-monaco Crayon-os-pc print-yes notranslate" data-settings=" minimize scroll-mouSEOver" style=" margin-top: 12px; margin-bottom: 12px; font-size: 12px !important; line-height: 15px !important;">
Crayon-toolbar" data-settings=" mouSEOver overlay hide delay" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">Crayon-title">
Crayon-tools" style="font-size: 12px !important;height: 18px !important; line-height: 18px !important;">Crayon-mixed-highlight" title="Contains Mixed Languages">
Crayon-button Crayon-nums-button" title="Toggle Line Numbers">
Crayon-button-icon">
Crayon-button Crayon-plain-button" title="Toggle Plain Code">
Crayon-button-icon">
Crayon-button Crayon-wrap-button" title="Toggle Line Wrap">
Crayon-button-icon">
Crayon-button Crayon-expand-button" title="Expand Code">
Crayon-button-icon">
Crayon-button Crayon-copy-button" title="Copy">
Crayon-button-icon">
Crayon-button Crayon-popup-button" title="Open Code In New Window">
Crayon-language">XHTMLCrayon-button-icon">
Crayon-info" style="min-height: 16.8px !important; line-height: 16.8px !important;">
Crayon-plain-wrap">
Crayon-main" style="">Crayon-table">
| Crayon-nums " data-settings="show"> Crayon-nums-content" style="font-size: 12px !important; line-height: 15px !important;"> Crayon-code">Crayon-num" data-line="Crayon-5c891d0023e33477205018-1">1 Crayon-num" data-line="Crayon-5c891d0023e33477205018-3">3 Crayon-num" data-line="Crayon-5c891d0023e33477205018-5">5 Crayon-num" data-line="Crayon-5c891d0023e33477205018-7">7 Crayon-num" data-line="Crayon-5c891d0023e33477205018-9">9 Crayon-num" data-line="Crayon-5c891d0023e33477205018-11">11 Crayon-num" data-line="Crayon-5c891d0023e33477205018-13">13 Crayon-num" data-line="Crayon-5c891d0023e33477205018-15">15 Crayon-pre" style="font-size: 12px !important; line-height: 15px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"> Crayon-line Crayon-striped-line" id="Crayon-5c891d0023e33477205018-4">Crayon-i "> Crayon-r "><Meta Crayon-e ">http-equivCrayon-o">=Crayon-s ">"Content-Type"Crayon-h"> Crayon-e ">contentCrayon-o">=Crayon-s ">"text/html; charset=utf-8"Crayon-i "> Crayon-line" id="Crayon-5c891d0023e33477205018-5">Crayon-i "> Crayon-r "> Crayon-line Crayon-striped-line" id="Crayon-5c891d0023e33477205018-6">Crayon-i "> Crayon-c">Crayon-i "> Crayon-line" id="Crayon-5c891d0023e33477205018-7">Crayon-i "> Crayon-r ">Crayon-e ">relCrayon-o">=Crayon-s ">"stylesheet"Crayon-h"> Crayon-e ">hrefCrayon-o">=Crayon-s ">"css/bootstrap.min.css"Crayon-i "> Crayon-line Crayon-striped-line" id="Crayon-5c891d0023e33477205018-8">Crayon-i "> Crayon-c">Crayon-i "> Crayon-line" id="Crayon-5c891d0023e33477205018-9">Crayon-i "> Crayon-r ">Crayon-e ">relCrayon-o">=Crayon-s ">"stylesheet"Crayon-h"> Crayon-e ">hrefCrayon-o">=Crayon-s ">"css/bootstrap-theme.min.css"Crayon-i "> 如果您对Bootstrap感兴趣，可以点击下方的网站学习更多关于Bootstrap方面的知识。 猜你在找的wordpress相关文章 |