Bootstrap3.3.5基础知识学习笔记：HTML/CSS/JS应用详解

98 浏览量更新于2024-09-01 收藏 177KB PDF 举报

"本篇学习笔记详细介绍了Bootstrap基础知识，Bootstrap是一个流行的前端框架，常用于快速构建响应式网站。笔记针对Bootstrap 3.3.5版本，主要讲解了如何在JSP项目中引入和使用Bootstrap。以下是关键知识点： 1. 引入Bootstrap库：学习笔记提供了页面引用部分，展示了如何在HTML中引入Bootstrap的核心JavaScript（`bootstrap.js`）、CSS样式表（`bootstrap.css`和`bootstrap-theme.css`）。这些文件通常通过CDN或者本地路径（`<%=path%>`）来加载。对于不支持HTML5的旧版IE浏览器，还推荐了HTML5shiv和respond.js来增强兼容性。 2. 基本结构：页面结构遵循Bootstrap的标准模板，包括`<!DOCTYPE html>`声明、`<html>`元素、`<head>`部分的元标签，如`<meta>`标签用于设置语言、字符集、视口和兼容模式等。`<base>`标签用于定义页面的URL基础，`<title>`标签设定页面标题。 3. 样式与布局：Bootstrap提供了一系列预定义的CSS类，如栅格系统（Grid System）用于响应式布局，以及按钮、导航、表单等组件的样式。了解并掌握这些基本组件是使用Bootstrap的关键。 4. JavaScript功能：Bootstrap的JavaScript插件，如模态框（Modal）、下拉菜单（Dropdown）、轮播图（Carousel）等，都是开发交互式网页的重要工具。学习笔记没有详述具体代码，但提到的`<script>`标签展示了如何加载jQuery，因为Bootstrap依赖于jQuery。 5. 兼容性和优化：对于老版本的浏览器，Bootstrap提供了一些条件注释（``）来引入额外的补丁，确保在不支持现代浏览器特性的环境中也能正常工作。 6. 学习资源：对于初学者或有一定HTML/CSS基础的人，这篇学习笔记提供了有价值的基础指导，对进一步探索Bootstrap的其他版本和特性也会有所帮助。这篇Bootstrap基础知识学习笔记为开发者提供了快速入门和参考的指南，适合那些希望提升前端开发效率并打造响应式设计的人员。"

bootstrap基础知识学习笔记基础知识学习笔记

主要针对bootstrap基础知识为大家整理了详细的学习笔记,具有一定的参考价值，感兴趣的小伙伴们可以参考一

下

在此就不做 bootstrap 的介绍了，近几年 bootstrap 越来越流行，一点不亚于 js 中的 jquery。

以下为 bootstrap 3.3.5 学习中记录的东西，方便查阅，作者使用的是 jsp ，跟 html 可能有稍许不同，请自行参考修改

【引用文件】【引用文件】

【页面引用】【页面引用】

路径请自行规划

<!--[if lt IE 9]>

<![endif]-->

【标准模板】【标准模板】

<!DOCTYPE html>

<html>

<head>

<title>bootstrap 模板</title>

<!--[if lt IE 9]>

下载后可阅读完整内容，剩余5页未读，立即下载

weixin_38741101

粉丝: 6
资源: 926

Bootstrap3.3.5基础知识学习笔记：HTML/CSS/JS应用详解

bootstrap 教程，带笔记

bootstrap学习笔记

Bootstrap基本样式学习笔记之按钮(4)

Bootstrap基本插件学习笔记之按钮(21)

Bootstrap基本样式学习笔记之图片(6)

Bootstrap基本样式学习笔记之表格(2)

Bootstrap基本样式学习笔记之标签(5)

Bootstrap基本插件学习笔记之标签切换(17)

Bootstrap基本组件学习笔记之缩略图(13)

Bootstrap基本组件学习笔记之input输入框组(9)

最新资源