然爸读书笔记(2014-10)----Bootsrap用户手册
本来其实这方面的知识,可以直接在网站上看,但是自己是web前端的小白。基本不懂。所以,还是买一本书来看,更好些。体现出我对前端的重视。
Bootstrap是快速开发Web应用程序的前端工具包。它是一个CSS和HTML的集合,它使用了最新的浏览器技术,给你的Web开发提供了时尚的版式,表单,buttons,表格,网格系统等等。
第一章:Bootstrap提供的网站框架
(1)Bootstrap的文件结构
bootstrap/
├── css/
│ ├── bootstrap.css
│ ├── bootstrap.min.css
│ ├── bootstrap-theme.css
│ └── bootstrap-theme.min.css
├── js/
│ ├── bootstrap.js
│ └── bootstrap.min.js
└── fonts/
├── glyphicons-halflings-regular.eot
├── glyphicons-halflings-regular.svg
├── glyphicons-halflings-regular.ttf
└── glyphicons-halflings-regular.woff
(2)响应式设计
要使bootstrap支持响应式布局,必须在<head>标签中添加<meta>标签。另外,你下载的文件中没有响应式的css文件,也需要单独下载。
第二章:Bootstrap预定义的css样式
(1)排版
bootstrap定义了6个级别的标题,分别是h1-h6,h1是36像素高;用class="lead"强调段落;用<strong>来强调具体文本;用<abbr>来标记缩写词。
(2)表格
适用<table>,<tr>,<td>来制定表格。
(3)表单
适用<form>制定表单。
第三章:Bootstrap内置的布局组件
(1)下拉菜单
class="dropdown-menu",用pull-right来右对齐等。
(2)按钮组
class="btn-group"。
(3)导航元素
class="nav";class="navbar"。
(4)标签
class="label";class="badge"。
(5)缩略图
class="thumbnail"。
(6)进度条
class="progress"。
第四章:Bootstrap支持的JavaScript插件
(1)模态框
class="modal"。
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· 单线程的Redis速度为什么快?
· 展开说说关于C#中ORM框架的用法!
· SQL Server 2025 AI相关能力初探
· Pantheons:用 TypeScript 打造主流大模型对话的一站式集成库