登录注册
京东自营 + 国补 iPhone 历史最低价          国家补贴 享8折

Xebcnor

  • 使用 Sass

    虽然 Bootstrap 是基于 Less 构建的，我们还提供了一套官方支持的 Sass 移植版代码。我们将这个版本放在单独的 GitHub 仓库中进行维护，并通过脚本处理源码更新。包含的内容由于 Sass 移植版存放于单独的仓库，并针对不同的使用群体，这个项目中的内容与 Bootstrap 主项目有很大不同。这也是为了保证 Sass 移植版与更多基于 Sass 的系统相兼容。

    Xebcnor
    使用， sass， bootstrap， 中文版

  • 使用 Less

    Bootstrap 的 CSS 文件是通过 Less 源码编译而来的。Less 是一门预处理语言，支持变量、mixin、函数等额外功能。对于希望使用 Less 源码而非编译而来的 CSS 文件的用户，Bootstrap 框架中包含的大量变量、mixin 将非常有价值。针对栅格系统的变量和 mixin 包含在栅格系统章节。

    Xebcnor
    使用， less， bootstrap， 中文版

  • 响应式工具

    为了加快对移动设备友好的页面开发工作，利用媒体查询功能并使用这些工具类可以方便的针对不同设备展示或隐藏页面内容。另外还包含了针对打印机显示或隐藏内容的工具类。有针对性的使用这类工具类，从而避免为同一个网站创建完全不同的版本。相反，通过使用这些工具类可以在不同设备上提供不同的展现形式。

    Xebcnor
    响应式， 工具， bootstrap， 中文版

  • 辅助类

    情境文本颜色通过颜色来展示意图，Bootstrap 提供了一组工具类。这些类可以应用于链接，并且在鼠标经过时颜色可以还可以加深，就像默认的链接一样。<p class="text-muted">...</p><p class="text-primary">...</p><p class="text-success">...</p><p class="text-info">...</p><p class="text-warning">...<

    Xebcnor
    辅助， bootstrap， 中文版

  • 图片

    响应式图片在 Bootstrap 版本 3 中，通过为图片添加 .img-responsive 类可以让图片支持响应式布局。其实质是为图片设置了 max-width: 100%;、 height: auto; 和 display: block; 属性，从而让图片在其父元素中更好的缩放。如果需要让使用了 .img-responsive 类的图片水平居中，请使用 .center-block 类，不要用 .text-center。 请参考助手类章节 了解更多关于 .

    Xebcnor
    图片， bootstrap， 中文版

  • 按钮

    可作为按钮使用的标签或元素为 <a>、<button> 或 <input> 元素添加按钮类（button class）即可使用 Bootstrap 提供的样式。<a class="btn btn-default" href="#" role="button">Link</a><button class="btn btn-default" type="submit">Button</button><input class="btn btn-default" type="button" value="Input">

    Xebcnor
    按钮， bootstrap， 中文版

  • 表单

    基本实例单独的表单控件会被自动赋予一些全局样式。所有设置了 .form-control 类的 <input>、<textarea> 和 <select> 元素都将被默认设置宽度属性为 width: 100%;。 将 label 元素和前面提到的控件包裹在 .form-group 中可以获得最好的排列。<form> <div class="form-group"> <label for="exampleInputEmail1">Email address<

    Xebcnor
    表单， bootstrap， 中文版

  • 表格

    基本实例为任意 <table> 标签添加 .table 类可以为其赋予基本的样式 — 少量的内补（padding）和水平方向的分隔线。这种方式看起来很多余！？但是我们觉得，表格元素使用的很广泛，如果我们为其赋予默认样式可能会影响例如日历和日期选择之类的插件，所以我们选择将此样式独立出来。 <table class="table"> ... </table>条纹状表格通过 .

    Xebcnor
    表格， bootstrap， 中文版

  • 代码

    内联代码通过 <code>标签包裹内联样式的代码片段。 For example, <code>&lt;section&gt;</code> should be wrapped as inline.用户输入通过 <kbd> 标签标记用户通过键盘输入的内容。= To switch directories, type <kbd>cd</kbd> followed by the name of the directory.<br> To edit settings, press <

    Xebcnor
    代码， bootstrap， 中文版

  • 排版

    标题HTML 中的所有标题标签，<h1> 到 <h6> 均可使用。另外，还提供了 .h1 到 .h6 类，为的是给内联（inline）属性的文本赋予标题的样式。 <h1>h1. Bootstrap heading</h1> <h2>h2. Bootstrap heading</h2> <h3>h3. Bootstrap heading</h3> <h4>h4. Bootstrap heading</h4> <h5>h5.

    Xebcnor
    排版， bootstrap， 中文版

  • 栅格系统

    Bootstrap 提供了一套响应式、移动设备优先的流式栅格系统，随着屏幕或视口（viewport）尺寸的增加，系统会自动分为最多 12 列。它包含了易于使用的预定义类，还有强大的 mixin 用于生成更具语义的布局。简介栅格系统用于通过一系列的行（row）与列（column）的组合来创建页面布局，你的内容就可以放入这些创建好的布局中。

    Xebcnor
    栅格， 系统， bootstrap， 中文版

  • 概览

    深入了解 Bootstrap 底层结构的关键部分，包括我们让 web 开发变得更好、更快、更强壮的最佳实践。HTML5 文档类型Bootstrap 使用到的某些 HTML 元素和 CSS 属性需要将页面设置为 HTML5 文档类型。在你项目中的每个页面都要参照下面的格式进行设置。 <!DOCTYPE html> <html lang="zh-CN"> ... </html>

    Xebcnor
    概览， bootstrap， 中文版

  • 可访问性

    Bootstrap 遵循统一的 web 标准，另外，通过做一些少量的修改，还可以让使用 辅助设备（AT - ASSISTIVE TECHNOLOGY）上网的人群访问你的站点。

    Xebcnor
    可访问性， bootstrap， 中文版

  • 对第三方组件的支持

    虽然我们并不官方支持任何第三方插件，我们还是提供一些建议，帮你避免可能在你的项目中会出现的问题。box-sizing 属性某些第三方软件，包括 Google 地图和 Google 定制搜索引擎都会由于 * { box-sizing: border-box; } 的设置而产生冲突，这一设置使 padding不影响页面元素最终宽度的计算。更多信息请参考 盒模型与尺寸计算 - CSS Tricks。

    Xebcnor
    第三方， 组件， 支持， bootstrap， 中文版

  • 浏览器和设备的支持情况

    Bootstrap 的目标是在最新的桌面和移动浏览器上有最佳的表现，也就是说，在较老旧的浏览器上可能会导致某些组件表现出的样式有些不同，但是功能是完整的。被支持的浏览器特别注意，我们坚决支持这些浏览器的最新版本。在 Windows 平台，我们支持 Internet Explorer 8-11。请看下面列出的详细信息。

    Xebcnor
    浏览器， 设备， 支持， 情况， bootstrap

  • 从 v2.x 版本升级到 v3.x 版本

    你在找从老版本升级到 Bootstrap v3.x 版本的方法吗？请查看我们整理的升级指南吧。

    Xebcnor
    v2.x， 版本， 升级到， v3.x， bootstrap

  • 禁止响应式布局

    Bootstrap 会自动帮你针对不同的屏幕尺寸调整你的页面，使其在各个尺寸的屏幕上表现良好。下面我们列出了如何禁用这一特性，就像这个非响应式布局实例页面一样。禁止响应式布局有如下几步：移除 此 CSS 文档中提到的设置浏览器视口（viewport）的标签：<meta>。通过为 .container 类设置一个 width 值从而覆盖框架的默认 width 设置，例如 width: 970px !important;

    Xebcnor
    禁止， 响应式， 布局， bootstrap， 中文版

  • 社区

    Bootstrap 有成熟、强大的社区。如果你希望随时获取 Bootstrap 的最新消息，请关注以下社区资源。阅读并订阅 Bootstrap 官方博客。通过 IRC （irc.freenode.net 服务器）与其他 Bootstrap 粉丝交流，我们在 ##bootstrap 频道。如果使用 Bootstrap 过程中遇到问题，请在 StackOverflow 上交流。请搜索 twitter-bootstrap-3 关键词。

    Xebcnor
    社区， bootstrap， 中文版

  • 工具

    BootlintBootlint 是 Bootstrap 官方所支持的 HTML 检测工具。在使用了 Bootstrap 的页面上（没有对 Bootstrap 做修改和扩展的情况下），它能自动检查某些常见的 HTML 错误。纯粹的 Bootstrap 组件需要固定的 DOM 结构。Bootlint 就能检测你的页面上的这些“纯粹”的 Bootstrap 组件是否符合 Bootstrap 的 HTML 结构规则。

    Xebcnor
    工具， bootstrap， 中文版

  • 基本模板

    使用以下给出的这份超级简单的 HTML 模版，或者修改这些实例。我们强烈建议你对这些实例按照自己的需求进行修改，而不要简单的复制、粘贴。拷贝并粘贴下面给出的 HTML 代码，这就是一个最简单的 Bootstrap 页面了。<!DOCTYPE html><html lang="zh-cn"> <head> <meta charset="utf-8"> <

    Xebcnor
    基本， 模板， bootstrap， 中文版
上一页 下一页

个人简介

  1. Xebcnor

  2. 前端学习 GO GO GO

  3. 获得 22643 积分

  4. https://nowjava.com/creator/10010

热门标签

关注时代Java

Copyright © 2014-2024NowJava. All Rights Reserved. 时代Java 版权所有 京ICP备14059627号-7

关注时代Java