Bootstrap输入框组本章将讲解Bootstrap支持的另一个特性,输入框组。输入框组扩展自表单控件。使用输入框组,您可以很容易地向基于文本的输入框添加作为前缀和后缀的文本或按钮。通过向输入域添加前缀和后缀的内容,您可以向用户输入添加公共的元素。例如,您可以添加美元符号,或者在Twitter用户名前添加@,或者应用程序接口所需要的其他公共的元素。向.form-control添加前缀或后缀元素的步骤如下:把前缀或后缀元素放在一个带有class.input-group的中。接着,在相同的内,在class为.input-group-addon的内放置额外的内容。把该放置在元素的前面或者后面。为了
Bootstrap输入框组本章将讲解Bootstrap支持的另一个特性,输入框组。输入框组扩展自表单控件。使用输入框组,您可以很容易地向基于文本的输入框添加作为前缀和后缀的文本或按钮。通过向输入域添加前缀和后缀的内容,您可以向用户输入添加公共的元素。例如,您可以添加美元符号,或者在Twitter用户名前添加@,或者应用程序接口所需要的其他公共的元素。向.form-control添加前缀或后缀元素的步骤如下:把前缀或后缀元素放在一个带有class.input-group的中。接着,在相同的内,在class为.input-group-addon的内放置额外的内容。把该放置在元素的前面或者后面。为了
Bootstrap按钮组按钮组允许多个按钮被堆叠在同一行上。当你想要把按钮对齐在一起时,这就显得非常有用。您可以通过Bootstrap按钮(Button)插件添加可选的JavaScript单选框和复选框样式行为。下面的表格总结了Bootstrap提供的使用按钮组的一些重要的class:Class描述代码示例.btn-group该class用于形成基本的按钮组。在.btn-group中放置一系列带有class.btn的按钮。Button1Button2.btn-toolbar该class有助于把几组结合到一个中,一般获得更复杂的组件。.......btn-group-lg,.btn-group-
Bootstrap按钮组按钮组允许多个按钮被堆叠在同一行上。当你想要把按钮对齐在一起时,这就显得非常有用。您可以通过Bootstrap按钮(Button)插件添加可选的JavaScript单选框和复选框样式行为。下面的表格总结了Bootstrap提供的使用按钮组的一些重要的class:Class描述代码示例.btn-group该class用于形成基本的按钮组。在.btn-group中放置一系列带有class.btn的按钮。Button1Button2.btn-toolbar该class有助于把几组结合到一个中,一般获得更复杂的组件。.......btn-group-lg,.btn-group-
Bootstrap下拉菜单(Dropdowns)本章将重点介绍Bootstrap下拉菜单。下拉菜单是可切换的,是以列表格式显示链接的上下文菜单。这可以通过与下拉菜单(Dropdown)JavaScript插件的互动来实现。如需使用下拉菜单,只需要在class.dropdown内加上下拉菜单即可。下面的实例演示了基本的下拉菜单:实例divclass="dropdown">buttontype="button"class="btndropdown-toggle"id="dropdownMenu1"data-toggle="dropdown">主题spanclass="caret">span>but
Bootstrap下拉菜单(Dropdowns)本章将重点介绍Bootstrap下拉菜单。下拉菜单是可切换的,是以列表格式显示链接的上下文菜单。这可以通过与下拉菜单(Dropdown)JavaScript插件的互动来实现。如需使用下拉菜单,只需要在class.dropdown内加上下拉菜单即可。下面的实例演示了基本的下拉菜单:实例divclass="dropdown">buttontype="button"class="btndropdown-toggle"id="dropdownMenu1"data-toggle="dropdown">主题spanclass="caret">span>but
Bootstrap环境安装Bootstrap安装是非常容易的。本章将讲解如何下载并安装Bootstrap,讨论Bootstrap文件结构,并通过一个实例演示它的用法。下载Bootstrap您可以从http://getbootstrap.com/上下载Bootstrap的最新版本。当您点击这个链接时,您将看到如下所示的网页:您会看到两个按钮:DownloadBootstrap:下载Bootstrap。点击该按钮,您可以下载BootstrapCSS、JavaScript和字体的预编译的压缩版本。不包含文档和最初的源代码文件。DownloadSource:下载源代码。点击该按钮,您可以直接从from
Bootstrap环境安装Bootstrap安装是非常容易的。本章将讲解如何下载并安装Bootstrap,讨论Bootstrap文件结构,并通过一个实例演示它的用法。下载Bootstrap您可以从http://getbootstrap.com/上下载Bootstrap的最新版本。当您点击这个链接时,您将看到如下所示的网页:您会看到两个按钮:DownloadBootstrap:下载Bootstrap。点击该按钮,您可以下载BootstrapCSS、JavaScript和字体的预编译的压缩版本。不包含文档和最初的源代码文件。DownloadSource:下载源代码。点击该按钮,您可以直接从from
CSS属性选择器具有特定属性的HTML元素样式具有特定属性的HTML元素样式不仅仅是class和id。注意:IE7和IE8需声明!DOCTYPE才支持属性选择器!IE6和更低的版本不支持属性选择器。属性选择器下面的例子是把包含标题(title)的所有元素变为蓝色:实例[title]{color:blue;}尝试一下»属性和值选择器下面的实例改变了标题title='runoob'元素的边框样式:实例[title=runoob]{border:5pxsolidgreen;}尝试一下»属性和值的选择器-多值下面是包含指定值的title属性的元素样式的例子,使用(~)分隔属性和值:实例[title~=
CSS属性选择器具有特定属性的HTML元素样式具有特定属性的HTML元素样式不仅仅是class和id。注意:IE7和IE8需声明!DOCTYPE才支持属性选择器!IE6和更低的版本不支持属性选择器。属性选择器下面的例子是把包含标题(title)的所有元素变为蓝色:实例[title]{color:blue;}尝试一下»属性和值选择器下面的实例改变了标题title='runoob'元素的边框样式:实例[title=runoob]{border:5pxsolidgreen;}尝试一下»属性和值的选择器-多值下面是包含指定值的title属性的元素样式的例子,使用(~)分隔属性和值:实例[title~=