Bootstrap 列表组
本章我们将讲解列表组。列表组件用于以列表形式呈现复杂的和自定义的内容。创建一个基本的列表组的步骤如下：
向元素 <ul> 添加 class .list-group。
向 <li> 添加 class .list-group-item。
下面的实例演示了这点：
实例
<ul class="list-group">
<li……继续阅读 »
2年前 (2022-07-17) 442浏览 0评论
0个赞
JavaScript 简介
JavaScript 是互联网上最流行的脚本语言，这门语言可用于 HTML 和 web，更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备。
JavaScript 是脚本语言
JavaScript 是一种轻量级的编程语言。
JavaScript 是可插入 HTML 页面的编程代码。
JavaScript 插入 HTML 页面后，可由所有的现代浏览器执行。
JavaScri……继续阅读 »
2年前 (2022-07-17) 253浏览 0评论
0个赞
Bootstrap 折叠（Collapse）插件
折叠（Collapse）插件可以很容易地让页面区域折叠起来。无论您用它来创建折叠导航还是内容面板，它都允许很多内容选项。
如果您想要单独引用该插件的功能，那么您需要引用 collapse.js。同时，也需要在您的 Bootstrap 版本中引用 Transition（过渡）插件。或者，正如 Bootstrap 插件概览 一章中所提到，您可以引用 bootstrap.j……继续阅读 »
2年前 (2022-07-17) 362浏览 0评论
0个赞
CSS 列表
CSS 列表属性作用如下：
设置不同的列表项标记为有序列表
设置不同的列表项标记为无序列表
设置列表项标记为图像
列表
在 HTML中，有两种类型的列表：
无序列表 ul – 列表项标记用特殊图形（如小黑点、小方框等）
有序列表 ol – 列表项的标记有数字或字母
使用 CSS，可以列出进一步的样式，并可用图像作列表项标记。
无序列表如下所示:
Coffee
T……继续阅读 »
2年前 (2022-07-17) 73浏览 0评论
0个赞
CSS 计数器
CSS 计数器通过一个变量来设置，根据规则递增变量。
使用计数器自动编号
CSS 计数器根据规则来递增变量。
CSS 计数器使用到以下几个属性：
counter-reset – 创建或者重置计数器
counter-increment – 递增变量
content – 插入生成的内容
counter() 或 counters() 函数 – 将计数器……继续阅读 »
2年前 (2022-07-16) 195浏览 0评论
0个赞
HTML5 简介
HTML5是HTML最新的修订版本，2014年10月由万维网联盟（W3C）完成标准制定。
HTML5的设计目的是为了在移动设备上支持多媒体。
HTML5 简单易学。
什么是 HTML5?
HTML5 是下一代 HTML 标准。
HTML , HTML 4.01的上一个版本诞生于 1999 年。自从那以后，Web 世界已经经历了巨变。
HTML5 仍处于完善之中。然而，大部分现代浏览器已经具备了某……继续阅读 »
2年前 (2022-07-16) 195浏览 0评论
0个赞
function checkVideo() {
let support = “非常棒！你的浏览器支持HTML5 video标签！”,
someSupport = “Meh. Some support.”,
notSupport = “Sorry. No video support.”,
vidTest = document.createE……继续阅读 »
2年前 (2022-07-16) 245浏览 0评论
0个赞
JavaScript Browser 对象 实例
使用JavaScript来访问和控制浏览器对象实例。
Window 对象
弹出一个警告框
弹出一个带折行的警告框
弹出一个确认框，并提醒访客点击的内容
弹出一个提示框
点击一个按钮时，打开一个新窗口
打开一个新窗口，并控制其外观
打开多个新窗口
确保新的窗口没有获得焦点
确保新的窗口获得焦点
关闭新窗口
检查新的窗口是否已关闭
返回新窗口的名字
传输一些文本到源（……继续阅读 »
2年前 (2022-07-16) 193浏览 0评论
0个赞
JavaScript 库
JavaScript 库 – jQuery、Prototype、MooTools。
JavaScript 框架（库）
JavaScript 高级程序设计（特别是对浏览器差异的复杂处理），通常很困难也很耗时。
为了应对这些调整，许多的 JavaScript (helper) 库应运而生。
这些 JavaScript 库常被称为 JavaScript 框架。
在本教程中，我们……继续阅读 »
2年前 (2022-07-16) 218浏览 0评论
0个赞
Font Awesome 医疗图标
下表显示了所有的 Font Awesome 医疗图标：
图标
描述
实例
fa fa-ambulance
尝试一下
fa fa-h-square
尝试一下
fa fa-heart
尝试一下
fa fa-heart-o
尝试一下
fa fa-heartbeat
尝试一下
fa fa-hospital-o
尝试一下
fa fa-med……继续阅读 »
2年前 (2022-07-16) 242浏览 0评论
0个赞
JavaScript Window Location
window.location 对象用于获得当前页面的地址 (URL)，并把浏览器重定向到新的页面。
Window Location
window.location 对象在编写时可不使用 window 这个前缀。
一些例子：
一些实例:
location.hostname 返回 web 主机的域名
location.pathname 返回当前页面的路径和……继续阅读 »
2年前 (2022-07-02) 301浏览 0评论
0个赞
Bootstrap 页面标题（Page Header）
页面标题（Page Header）是个不错的功能，它会在网页标题四周添加适当的间距。当一个网页中有多个标题且每个标题之间需要添加一定的间距时，页面标题这个功能就显得特别有用。如需使用页面标题（Page Header），请把您的标题放置在带有 class .page-header 的 <div> 中：
实例
<div class="pa……继续阅读 »
2年前 (2022-07-02) 166浏览 0评论
0个赞
Bootstrap CSS 概览
在这一章中，我们将讲解 Bootstrap 底层结构的关键部分，包括我们让 web 开发变得更好、更快、更强壮的最佳实践。
HTML 5 文档类型（Doctype）
Bootstrap 使用了一些 HTML5 元素和 CSS 属性。为了让这些正常工作，您需要使用 HTML5 文档类型（Doctype）。
因此，请在使用 Bootstrap 项目的开头包含下面的代码段。
<!D……继续阅读 »
2年前 (2022-07-01) 141浏览 0评论
0个赞
JavaScript HTML DOM 元素 (节点)
本章节介绍如何向文档中添加和移除元素(节点)。
创建新的 HTML 元素 (节点) – appendChild()
要创建新的 HTML 元素 (节点)需要先创建一个元素，然后在已存在的元素中添加它。
实例
<div id="div1">
<p id="p1">这是一个段落。</……继续阅读 »
2年前 (2022-07-01) 254浏览 0评论
0个赞
Font Awesome 货币图标
下表显示了所有的 Font Awesome 货币图标：
图标
描述
实例
fa fa-bitcoin
尝试一下
fa fa-btc
尝试一下
fa fa-cny
尝试一下
fa fa-dollar
尝试一下
fa fa-eur
尝试一下
fa fa-euro
尝试一下
fa fa-gbp
尝试一下
fa fa-ils
尝试一……继续阅读 »
2年前 (2022-07-01) 142浏览 0评论
0个赞
JavaScript 注释
JavaScript 注释可用于提高代码的可读性。
JavaScript 注释
JavaScript 不会执行注释。
我们可以添加注释来对 JavaScript 进行解释，或者提高代码的可读性。
单行注释以 // 开头。
本例用单行注释来解释代码：
实例
// 输出标题：
document.getElementById("myH1").innerHTML=&quo……继续阅读 »
2年前 (2022-07-01) 336浏览 0评论
0个赞
Bootstrap 下拉菜单（Dropdown）插件
Bootstrap 下拉菜单 这一章讲解了下拉菜单，但是没有涉及到交互部分，本章将具体讲解下拉菜单的交互。使用下拉菜单（Dropdown）插件，您可以向任何组件（比如导航栏、标签页、胶囊式导航菜单、按钮等）添加下拉菜单。
如果您想要单独引用该插件的功能，那么您需要引用 dropdown.js。或者，正如 Bootstrap 插件概览 一章中所提到，您可以引用 bo……继续阅读 »
2年前 (2022-06-30) 315浏览 0评论
0个赞
CSS 伪元素
CSS 伪元素是用来添加一些选择器的特殊效果。
语法
伪元素的语法：
selector:pseudo-element {property:value;}
CSS类也可以使用伪元素：
selector.class:pseudo-element {property:value;}
:first-line 伪元素
“first-line” 伪元素用于向文本的首行设置特殊样……继续阅读 »
2年前 (2022-06-30) 222浏览 0评论
0个赞
CSS 属性 选择器
具有特定属性的HTML元素样式
具有特定属性的HTML元素样式不仅仅是class和id。
注意：IE7和IE8需声明!DOCTYPE才支持属性选择器！IE6和更低的版本不支持属性选择器。
属性选择器
下面的例子是把包含标题（title）的所有元素变为蓝色：
实例
[title]
{
color:blue;
}
属性和值选择器
下面的实例改变了标题title=’runoo……继续阅读 »
2年前 (2022-06-29) 279浏览 0评论
0个赞
Bootstrap 表格
Bootstrap 提供了一个清晰的创建表格的布局。下表列出了 Bootstrap 支持的一些表格元素：
标签
描述
<table>
为表格添加基础样式。
<thead>
表格标题行的容器元素（<tr>），用来标识表格列。
<tbody>
表格主体中的表格行的容器元素（<tr>）。
<tr>
一组出现……继续阅读 »
2年前 (2022-06-29) 196浏览 0评论
0个赞
Bootstrap5 弹出框
弹出框控件类似于提示框，它在鼠标点击到元素后显示，与提示框不同的是它可以显示更多的内容。
如何创建弹出框
通过向元素添加 data-bs-toggle=”popover”
来来创建弹出框。
title 属性的内容为弹出框的标题，data-bs-content 属性显示了弹出框的文本内容：
<button type="button"……继续阅读 »
2年前 (2022-06-29) 227浏览 0评论
0个赞
JavaScript 比较 和 逻辑运算符
比较和逻辑运算符用于测试 true 或者
false。
比较运算符
比较运算符在逻辑语句中使用，以测定变量或值是否相等。
<p给定 x=5，下面的表格解释了比较运算符：
运算符
描述
比较
返回值
实例
==
等于
x==8
false
实例 »
x==5
true
实例 »
===
绝对等于（值和类型均相等）
x===”5……继续阅读 »
2年前 (2022-06-28) 153浏览 0评论
0个赞
Bootstrap 下拉菜单（Dropdowns）
本章将重点介绍 Bootstrap 下拉菜单。下拉菜单是可切换的，是以列表格式显示链接的上下文菜单。这可以通过与 下拉菜单（Dropdown） JavaScript 插件 的互动来实现。
如需使用下拉菜单，只需要在 class .dropdown 内加上下拉菜单即可。下面的实例演示了基本的下拉菜单：
实例
<div class="dropdown&q……继续阅读 »
2年前 (2022-06-27) 169浏览 0评论
0个赞
Bootstrap5 卡片
简单的卡片
我们可以通过 Bootstrap5 的 .card 与 .card-body 类来创建一个简单的卡片，卡片可以包含头部、内容、底部以及各种颜色设置，实例如下:
实例
<div class="card">
<div class="card-body">简单的卡片</div>
</div&g……继续阅读 »
2年前 (2022-06-27) 275浏览 0评论
0个赞
CSS3 弹性盒子(Flex Box)
弹性盒子是 CSS3 的一种新的布局模式。
CSS3 弹性盒（ Flexible Box 或 flexbox），是一种当页面需要适应不同的屏幕大小以及设备类型时确保元素拥有恰当的行为的布局方式。
引入弹性盒布局模型的目的是提供一种更加有效的方式来对一个容器中的子元素进行排列、对齐和分配空白空间。
浏览器支持
表格中的数字表示支持该属性的第一个浏览器的版本号。
紧跟在数字后面……继续阅读 »
2年前 (2022-06-27) 118浏览 0评论
0个赞
JavaScript Cookie
function displayCookies()
{
var fname=getCookie(“firstname”);
if (fname==null) {fname=””;}
if (fname!=””) {fname=”firstname=”+fname;}
var lname=……继续阅读 »
2年前 (2022-06-27) 179浏览 0评论
0个赞
JavaScript 静态方法
静态方法是使用 static 关键字修饰的方法，又叫类方法，属于类的，但不属于对象，在实例化对象之前可以通过 类名.方法名 调用静态方法。
静态方法不能在对象上调用，只能在类中调用。
实例
class Runoob {
constructor(name) {
this.name = name;
}
static hello() {
return &quo……继续阅读 »
2年前 (2022-06-26) 226浏览 0评论
0个赞
Bootstrap4 折叠
Bootstrap4 折叠可以很容易的实现内容的显示与隐藏。
实例
<button data-toggle="collapse" data-target="#demo">折叠</button>
<div id="demo" class="collapse">
Lorem ip……继续阅读 »
2年前 (2022-06-26) 202浏览 0评论
0个赞
Bootstrap 按钮（Button）插件
按钮（Button）在 Bootstrap 按钮 一章中介绍过。通过按钮（Button）插件，您可以添加进一些交互，比如控制按钮状态，或者为其他组件（如工具栏）创建按钮组。
加载状态
如需向按钮添加加载状态，只需要简单地向 button 元素添加 data-loading-text=”Loading…” 作为其属性即可，如下面实例所示：……继续阅读 »
2年前 (2022-06-26) 243浏览 0评论
0个赞
Bootstrap 进度条
本章将讲解 Bootstrap 进度条。在本教程中，您将看到如何使用 Bootstrap 创建加载、重定向或动作状态的进度条。
Bootstrap 进度条使用 CSS3 过渡和动画来获得该效果。Internet Explorer 9 及之前的版本和旧版的 Firefox 不支持该特性，Opera 12 不支持动画。
默认的进度条
创建一个基本的进度条的步骤如下：
添加一个带有 class……继续阅读 »
2年前 (2022-06-25) 289浏览 0评论
0个赞
