Bootstrap/ StackBlitz

最新推荐文章于 2024-07-22 08:55:10 发布
最新推荐文章于 2024-07-22 08:55:10 发布
阅读量163 收藏 3
点赞数
文章标签： vue.js bootstrap javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44741835/article/details/137818740
版权
本文介绍了如何在项目中利用Bootstrap框架编写CSS样式，并将其放置在公共资源文件夹。同时提到V5版本翻译不全，可参考V4文档。StackBlitz作为在线IDE，对于Web开发者来说是创建、编辑和分享项目的好工具。
摘要由CSDN通过智能技术生成

我们选择Bootstrap框架编写网页的CSS样式，因此将Bootstrap框架的代码文件放在项目的公共资源文件夹public。

不懂的话直接到B站的简介

https://www.bilibili.com/video/BV1Gs4y157GS/?spm_id_from=333.337.search-card.all.click&vd_source=2e34d1dc65fcea86e9a5e2810ad78d17

Bootstrap官网

npm install bootstrap

npm list #检查bootstrap的版本

相关文件安装当前项目的npm_model目录下.

CSS 文件和JS文件代码在dist目录内。

Html模板需要自己写或者从模版中改。

 V5目前翻译没有完成，可以参考V4的文档。V4文档没有StackBlitz的链接。

Stack Blitz 为Vue创造者 Evan You 和Angular团队成员共同创立 在2017年推出。是一个在线的基于浏览器的集成开发环境（IDE），特别适合Web应用程序的开发。开发者在浏览器中创建，编辑，运行和分享项目，无需本地安装任何开发工具。

ARTHUR王旭光
关注
  • 0
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
StackBlitz基于VSCode实现的在线Web应用的IDE
08-11
StackBlitz - 基于VS Code ⚡️实现的在线Web应用的IDE
angular-bootstrap-include-j7pyfr：用StackBlitz:high_voltage:创建
02-10
标题 "angular-bootstrap-include-j7pyfr：用StackBlitz:high_voltage:创建" 暗示了这是一个关于使用Angular框架结合Bootstrap库进行前端开发的项目，并且该项目可能是在StackBlitz在线代码编辑器上创建的。...
stackblitz复现工具的使用
m0_54490098的博客
06-22 458
stackblitz使用
前端调试工具超全汇总（非常详细）零基础入门到精通，收藏这一篇就够了
leah126的博客
06-09 1106
在当今的前端开发领域，调试工具已经成为每个开发者不可或缺的“利器”。它们帮助我们高效地定位问题、优化代码，并提升整体的开发体验。本文将详细介绍一系列前端调试工具，包括开发者工具、代码编辑器、移动端调试、远程调试、抓包&代理、Mock数据、接口调试、构建分析、性能测试、JSON查看、在线代码编辑器以及点击元素跳转代码等工具。让我们一起探索这些强大的工具，为前端调试增添更多便捷与高效！
非常好用的前端在线IDE：stackblitz
yi742891270的博客
09-22 618
其是一个前端的在线IDE，可以登录你的GitHub来绑定，也可以直接在这网址打开github的代码运行。当点这些的时候，会自动创建一个在线项目，主题和vscode差不多，可以直接运行。
StackBlitz是什么
m0_46490535的博客
03-26 2505
什么是StackBlitz 简评：StackBlitz 是最近公开上线的一款在线 IDE，主要面向 Web 开发者，移植了很多 VS Code 的特性与功能，非常的方便易用。目前支持 Angular, React 和 Ionic， Vue 及自定义模板等等。 进入页面和使用页面 进入网页： 使用页面（可任意支持以上js，以anguiar为例）： 使用方式 1.需要登录github才可以保存本地文件，分享给别人。 2.分享的文件不会被别人改动所影响，文件一直在你的git上。 下载后的使用界面
效率翻倍工具，前端调试工具超全汇总！
骑着牛的奇兵的博客
03-10 2435
希望以下工具有时候你用的！在当今的前端开发领域，调试工具已经成为每个开发者不可或缺的“利器”。它们帮助我们高效地定位问题、优化代码，并提升整体的开发体验。本文将详细介绍一系列前端调试工具，包括开发者工具、代码编辑器、移动端调试、远程调试、抓包&代理、Mock数据、接口调试、构建分析、性能测试、JSON查看、在线代码编辑器以及点击元素跳转代码等工具。让我们一起探索这些强大的工具，为前端调试增添更多便捷与高效！
angular-bootstrap-base-cards-xxwjdw：创建于StackBlitz:high_voltage:
02-11
在本项目"angular-bootstrap-base-cards-xxwjdw"中，开发者使用了Angular框架与Bootstrap库来构建基础的卡片视图。这个项目可能是为Web应用提供一个可复用的组件，便于快速展示信息或者作为导航元素。让我们深入探讨...
angular-bootstrap-app-v2:用StackBlitz创建:high_voltage:
04-07
angular-bootstrap-app-v2 Angular项目介绍： 角版本： 角度版本：8+ 教程版本：1.0 资源： Angular文档： : 开发文章： : Angular是一个完整JavaScript框架 使用Angular，我们可以创建： 单页应用程序：在...
森林：由StackBlitz创建
02-15
标题“森林：由StackBlitz创建”提示我们这是一个与编程相关的项目，可能是一个网页或应用程序，使用了StackBlitz作为在线开发环境。StackBlitz是一个流行的基于云的集成开发环境（IDE），支持多种Web开发技术，如...
https-github.com-mdbootstrap-Vue-Bootstrap-with-Material-Design:用StackBlitz创建:high_voltage:
03-16
【标题】"https-github.com-mdbootstrap-Vue-Bootstrap-with-Material-Design:用StackBlitz创建:high_voltage" 指向的是一个基于GitHub的项目，该项目是关于使用Vue.js框架结合Material Design来构建Web应用。...
使用工具-StackBlitz 是最近公开上线的一款在线 IDE
jack_rose_me的博客
12-23 128
2、http://down.chinaz.com/soft/40114.htm MyWebServer 内网链接分享他人下载 1、Snipaste-2.5.4-Beta-x64 截图
不写代码建博客！在浏览器完成博客搭建，有超详细文档，小白轻松搞定
Orange_czh的博客
09-01 658
个人站点生成器，可以在浏览器完成全部操作！从搭建到部署都可以在浏览器中完成，不需要本地环境。附详细文档。
angular文档快速上手
前端啤酒屋
04-16 854
摘录部分angular.cn的解释 首先进入https://stackblitz.com/ 组件的基本目录： *ngFor： *ngFor 是一个 “结构型指令”。结构型指令会通过添加、删除和操纵它们的宿主元素等方式塑造或重塑 DOM 的结构。任何带有星号 * 的指令都是结构型指令。 <h2>Products</h2> <div *ngFor="let pr...
谷粒商城实战笔记-38-前端基础-Vue-指令-单向绑定&双向绑定
epitomizelu的专栏
07-20 1015
安全性v-text更安全，因为它总是将数据作为纯文本插入，不解析 HTML。v-html则可能引发安全问题，因为它会解析并渲染 HTML 标签。用途v-text适用于插入文本数据，而v-html适用于插入需要被解析为实际 HTML 的数据。处理 HTML 标签v-text忽略 HTML 标签，将其视为普通文本；v-html则会解析并显示 HTML 标签。二者都是单向绑定，元素绑定model，model不绑定元素，元素值改变时model值不会更新。
Vue 3 和 SpringBoot 实现文件分片上传示例
最新发布
exlink2012的专栏
07-22 415
实现分片上传，并使用Spring Boot在后端保存文件。前端将文件分片并逐个上传到后端，后端接收到所有分片后再进行合并，最终保存为一个完整文件。
vue图片存放在public目录和src/assets目录下的区别
Zing_ing的博客
07-19 626
使用随时要更换的图片，有更新动态显示的需求，像banner、轮播、广告、展示性等大型图片放在public下比较合适；而一些icon、精灵图、雪碧图更适合放在assets下。如果图片不需要被处理，比如网站的结构用图，如logo图片，则放public中，否则如内容图片或者需要被构建为base64的小图标可以放assets中。
import 'bootstrap/dist/css/bootstrap.js是什莫意思
07-16
实际上，引入 `bootstrap/dist/css/bootstrap.js` 是一个错误的语法。Bootstrap 的 CSS 文件通常以 `.css` 结尾，而不是 `.js` 结尾。 正确的引入方式是：`import 'bootstrap/dist/css/bootstrap.css';` 或者 `@import 'bootstrap/scss/bootstrap.scss';`，它们都是引入 Bootstrap 的 CSS 文件。 如果你的代码中使用了 `import 'bootstrap/dist/css/bootstrap.js';` 这样的语句，建议将其修改为正确的引入方式，即 `import 'bootstrap/dist/css/bootstrap.css';` 或者 `@import 'bootstrap/scss/bootstrap.scss';`，这样才能正确地引入 Bootstrap 的样式文件。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值