Ruby on rails專案中 引入Bootstrap
Bootstrap 官網的教程
https://v4.bootcss.com/docs/getting-started/download/
- 第一步去專案中的Gemfile 檔案中新增引入bootstrap
gem 'bootstrap', '~> 4.5.0'
gem 'jquery-rails'
- 第二步去application.scss檔案中引入
@import "bootstrap";
- 第三步 去頁面中引用
<h1>mw</h1>
<div class="alert alert-success">
提示
</div>
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-alarm-fill" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" d="M6 .5a.5.5 0 0 1 .5-.5h3a.5.5 0 0 1 0 1H9v1.07a7.001 7.001 0 0 1 3.274 12.474l.601.602a.5.5 0 0 1-.707.708l-.746-.746A6.97 6.97 0 0 1 8 16a6.97 6.97 0 0 1-3.422-.892l-.746.746a.5.5 0 0 1-.707-.708l.602-.602A7.001 7.001 0 0 1 7 2.07V1h-.5A.5.5 0 0 1 6 .5zM.86 5.387A2.5 2.5 0 1 1 4.387 1.86 8.035 8.035 0 0 0 .86 5.387zM11.613 1.86a2.5 2.5 0 1 1 3.527 3.527 8.035 8.035 0 0 0-3.527-3.527zM8.5 5.5a.5.5 0 0 0-1 0v3.362l-1.429 2.38a.5.5 0 1 0 .858.515l1.5-2.5A.5.5 0 0 0 8.5 9V5.5z"/>
</svg>
相關文章
- Ruby on Rails 生成指定版本的 Rails 專案AI
- Angular專案中如何引入 bootstrapAngularboot
- rails on ruby,ruby on rails 之程式碼塊(二)AI
- ruby on rails 小技巧AI
- Ruby on Rails Ping ++ 支付AI
- ruby on rails筆記和理解AI筆記
- Ruby on Rails中的MVC架構是如何工作的AIMVC架構
- Ruby on Rails Mountable vs. Full EngineAI
- 從NodeJS切換到Ruby on Rails - nikodunkNodeJSAI
- Rails並不是用Ruby編寫的AI
- vue 專案中ivew按需引入Vue
- ruby操作專案.xcodeprojXCode
- laravel+vue專案中引入ueditorLaravelVue
- 從0使用Ruby on Rails打造企業級RESTful API專案實戰之我的雲音樂AIRESTAPI
- 在spring boot專案(maven)中引入其他 spring boot專案Spring BootMaven
- vue專案引入jqueryVuejQuery
- 在vue下引入jquery bootstrapVuejQueryboot
- vue專案中如何全域性引入scss/sass檔案VueCSS
- 新建vite + bootstrap 5 專案Viteboot
- 【Ruby on Rails全棧課程】2.7 塊(Block)和迭代器AI全棧BloC
- 強大的Rails/Ruby開發工具:JetBrains RubyMine 2023 for macAIMac
- 從底層去認識 ruby 的load,require,gems,bundler,以及rails中的autoloadingUIAI
- QT creator中cmake管理專案,如何引入外部庫(引入Eigen庫為例)QT
- 專案引入reactiveCoCoa步驟React
- Vue專案搭建 + 引入ElementUIVueUI
- iOS-在專案中引入RSA演算法iOS演算法
- Bootstrap相關專案推薦boot
- 肖威洞察 | Ruby on Rails 的快速學習的體系框架;AI框架
- 開發新手最容易犯的50個 Ruby on Rails 錯誤(1)AI
- 幽默:Ruby on Rails團隊提出Rail治理名單引發爭議AI
- vue專案如何全域性引入scss檔案VueCSS
- Maven 專案引入本地 jar 包方法MavenJAR
- golang 專案引入私有倉庫包Golang
- 幽默:Ruby on Rails建立者DHH質疑無伺服器和微服務AI伺服器微服務
- 如何在Vue專案中引入騰訊驗證碼服務Vue
- Ruby on Rails 動態渲染遠端程式碼執行漏洞 (CVE-2016-0752)AI
- 小專案不想引入 MQ?試試 Debezium!MQ
- vue2.0專案引入element-uiVueUI