bootstrap 的简单模板

最新推荐文章于 2024-02-19 09:50:17 发布
最新推荐文章于 2024-02-19 09:50:17 发布
阅读量514 收藏
点赞数
分类专栏： front
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u012745499/article/details/116504568
版权

bootstrap 是一款基于 jquery 的响应式前端框架, 包含内置的 css 样式和 js 组件
可以用 bootstrap 快速开发前端界面.

<!DOCTYPE html>
<html lang="zh-CN">
<head>

    <!--这 3 个务必放在 head 里最前面-->
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!--双核浏览器优先使用极速模式-->
    <meta name="renderer" content="webkit">

    <title>Title</title>

    <!--先引入样式, 再引入脚本-->
    <!--bootstrap css-->
    <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.4.1/css/bootstrap.css" rel="stylesheet">



</head>
<body>

<!--
    https://v3.bootcss.com/getting-started/

    栅格系统: 12 列
-->

<!--固定宽度-->
<div class="container">
    class="container"
</div>

<!--100% 宽度-->
<div class="container-fluid">
    class="container-fluid"
</div>

<!-- bootstrap.js 依赖 jquery.js-->
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>

<!--bootstrap js-->
<script src="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.4.1/js/bootstrap.js"></script>

</body>
</html>
艾斯比的日常
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
漂亮的bootstrap后台模板
百创科技
11-17 430
我们重视网站的速度和性能，并采用了优化的CSS和JavaScript，以提供更快的加载速度和更好的用户体验。Bootstrap后台模板为您提供了一种简单而强大的方式来构建出色的管理界面，为用户带来无缝的操作体验。此外，我们的Bootstrap后台模板支持多个主题和布局，让您能够根据自己的品牌风格或用户需求进行定制。为了提升SEO效果，我们使用最佳的代码结构和优化技巧来保证您的网站在搜索引擎结果中获得更高的排名。总结而言，我们的漂亮Bootstrap后台模板是您打造完美网站或应用程序的最佳选择。
bootstrap简单模板
08-06
这个“bootstrap简单模板”压缩包提供了一些基本的界面元素，如菜单和表格，方便开发者快速搭建网页布局。 首先，我们来看看“菜单”。在Bootstrap中，导航菜单通常使用Nav组件来创建。Nav组件支持多种样式，包括...
Bootstrap简单模板
YarMing的博客
04-24 1597
&lt;!DOCTYPE html&gt; &lt;html lang="zh-CN"&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;!--IE内核使用更高的渲染展示效果--&gt; &lt;meta http-equiv="X-UA-Compatible" content="IE=edge&
bootstrap 后端模板
wuchangjian的专栏
08-30 1474
目录 一、EasyUI 二、DWZ JUI 三、HUI 四、BUI 五、Ace Admin 六、Metronic 七、H+ UI 八、Admin LTE 九、INSPINIA 十、LigerUI 十一、其它UI 十二、总结 最近要做一个企业的OA系统，以前一直使用EasyUI，一...
Bootstrap简单模板与基本表格
热门推荐
晓剑
08-05 2万+
一：页面套用          模板下面专门有个内容页是空白的页面blank page,方便我们套用，右边菜单我们把不需要的删除掉就留几个就可以了                     内容的位置我们右键源码可以很方便的看到，          其实他注释和样式名称表达得很清楚，这个(class="container-fluid")样式下面的就是放得内容了
1. Bootstrap简单模板
YuhNagi的博客
10-10 1020
记录Bootstrap的学习。
分享45个Bootstrap模板，总有一款适合您
最新发布
zy0412326的专栏
02-19 1105
知识付费甚欢喜，为咱码农谋福利。jQuery bootstrap响应式多功能购物商城模版。简洁大气的jQuerybootstrap响应式网站模板。jQuery Bootstrap响应式购物商城模板。分享45个Bootstrap模板，总有一款适合您。bootstrap响应式admin后台管理模板。界面简洁的jQuery响应式网站模板。jQuery简洁的响应式购物商城模板。jQuery响应式企业网站模板。
Bootstrap3 网页模板
歪脖先生的博客
05-01 2698
Bootstrap使用最新的HTML5构建网页，要求所有文档必须是HTML5的文档类型。创建Bootstrap网页模板只需要两步： 第一步，安装Bootstrap的样式。只要使用 Bootstrap，就必须调用它的基本样式文件 bootstrap.css。如果需要使用自定义样式，可以通过自定义的 self.css 来覆盖 Bootstrap 的一些默认设置，而不是直接修改 bootstra...
bootstrap开源的后台管理系统模板
寂寥人生
06-18 1万+
AdminLTE https://github.com/ColorlibHQ/AdminLTE sb-admin https://github.com/StartBootstrap/startbootstrap-sb-admin sb-admin-2 https://github.com/StartBootstrap/startbootstrap-sb-admin-2 stisla https://github.com/stisla/stisla ace https://github.com/bop
Bootstrap网站模板
itmyhome的专栏
07-31 7279
基于上一篇文章,觉得再这样写下去,意义不大,决定收手。还是直接做一个简单的基础模板吧主要知识点包括栅格系统、响应式图片、导航条(固定在顶部和底部)、搜索框等等
bootstrap布局模板
08-02
这个压缩包文件“metronic.bootstrap”似乎包含了一套基于Bootstrap的布局模板集合，这将为开发者提供丰富的界面设计选项，帮助他们快速搭建美观且功能齐全的网站。 在Bootstrap布局中，有几个核心概念和技术值得...
bootstrap前端模板
01-31
这款后台管理前端模板利用Bootstrap的强大功能，为开发者提供了一套完整的、预设计的界面元素，使得创建专业且用户友好的后台管理系统变得快速而简单。 首先，我们要理解Bootstrap的核心概念。Bootstrap主要包括...
Bootstrap视频网站模板
05-28
1. **网格系统**：Bootstrap的12列响应式网格系统是其布局的基础，允许开发者通过简单的类选择器创建灵活的、适应不同屏幕尺寸的布局。 2. **响应式设计**：Bootstrap内置的CSS媒体查询确保了网页在手机、平板电脑...
bootstrap后台模板
07-24
3. **JavaScript插件**：Bootstrap包含了一系列集成的JavaScript插件，如模态框（Modal）、下拉菜单（Dropdown）、轮播（Carousel）和提示（Tooltip）等，这些插件通过简单的数据属性和JavaScript方法即可激活。...
css 的 opacity 属性
艾斯比
06-14 6416
opacity 用于指定元素透明度, 支持 0~1 之间的小数. 默认值 1-完全不透明, 0-完全透明 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>opacity</title> <style> /* opacity 默认 1, 完全不透明 0 完全透明
浏览器 f12 的 console 功能简介
艾斯比
04-27 4801
在做前端开发时, chrome 浏览器的 f12 功能非常好用, 可以调试 html js css 代码 其中 console 标签页表示控制台, 我们可以输入 js 代码, 回车执行 常用的命令有 console.log 打印日志 console.count 计数器, 记录执行的次数 console.time 计时, console.timeEnd 停止计时并打印 $() 表示使用选择器获取单个元素, $$() 表示使用选择器获取元素数组 // 打印 log info debug warn erro
js 如何获取对象的动态属性
艾斯比
05-11 4022
js 有两种方式获取对象的属性 点语法, 例如 person.name 中括号语法, 例如 person ['name'] 其中, 第一种不能使用变量, 而第二种可以使用变量 let person = { name: 'wj', age: 20 } // 点表示法 // 这里不能使用变量作为对象的属性名 console.log(person.name); // 中括号表示法 // 这里可以传入变量作为对象的属性名 let name = 'name';
js 绑定事件的 3 种方式
艾斯比
04-20 3880
js 作为脚本语言, 可以为页面上的元素绑定事件, 有 3 种方式 在 html 中, 声明 onclick 属性, 值为函数调用, 不推荐, html 和 js 耦合, 不利于维护 在 js 中, 对元素赋值 onclick 属性, 值为函数声明, 不推荐, 只能赋值一个回调函数, 多次赋值, 之前的会失效 在 js 中, 为元素添加 addEventListener, 推荐做法, 可以为一个事件类型绑定多个回调函数 <html> <button onclick="triggerC
bootstrap h5模板
05-16
以下是一个简单的 Bootstrap 5 H5 模板示例： ```html <!DOCTYPE html> , initial-scale=1.0"> <title>Bootstrap H5 Template <!-- 引入 Bootstrap 5 样式文件 --> ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值