📅  最后修改于: 2021-05-25 18:01:16        🧑  作者: Mango

创建一个将文本转换为语音的Web应用程序听起来很酷，并且如果所有这些功能都可用而不受任何第三方库的干扰，那么实现起来就更加容易。 Web语音API提供了一些基本工具，可用于创建启用了语音数据的交互式Web应用程序。我们创建了一个基本的界面，它有一个简单的框，其中包含我们将在其中输入文本的文本输入部分，以及两个滑块，可控制声音的速率和音调。然后，我们有一个下拉菜单，其中包含所有受支持的语言以及其中提...

📅  最后修改于: 2021-05-25 18:03:08        🧑  作者: Mango

下拉菜单是交互式网站最重要的部分之一。下拉菜单是菜单项的集合，允许用户从列表中选择一个值。.dropdown类用于设计下拉菜单。例子：输出：下拉分隔线：.dropdown-divider类用于通过使用细水平线划分下拉菜单列表。例子：输出：下拉标题：.dropdown-header类用于在下拉列表中添加标题部分。例子：输出：禁用和活动项目：.active类用于添加突出显示列表项。.disableed...

📅  最后修改于: 2021-05-25 18:03:35        🧑  作者: Mango

我们将学习如何编辑Bootstrap 4日期输入值。任务是借助简单的JavaScript代码更改date字段的值。方法：我们将使用HTML，JavaScript和CSS这三种Web技术。通常，当我们选择一些随机值并单击“提交”按钮时，它将自动调用一个名为edit()的嵌入式JavaScript函数。在函数，我们将从三个不同的字段中检索值，例如“ day(dd)”，“ month(mm)”和“ ye...

📅  最后修改于: 2021-05-25 18:04:15        🧑  作者: Mango

Bootstrap 5是Bootstrap的最新主要发行版，他们在其中修改了UI并进行了各种更改。徽章用于创建标签。通过使用相对字体大小，徽章可以缩放以匹配直接父元素的大小。句法：类型：以下是Bootstrap 5中提供的八种背景。bg-primarybg-secondary成功危险警告bg信息bg-light暗黑示例1：此示例演示了Bootstrap 5中前四种类型的Badge的工作方式。HTM...

📅  最后修改于: 2021-05-25 18:04:36        🧑  作者: Mango

描述：在Bootstrap 4中，可以在H1标签下方或下方添加H2标签。而在使用float的情况下，不能将H2标签添加到H1标签的下方或下方，因为由于bootstrap 4 CSS属性，H2标签将移至H1标签的末尾。为了消除这个问题，我们可以通过将两个标签都包裹在具有flex属性的元素上，或者通过将每个标签分别包裹在具有class clearfix类的元素上，来将H2移到F1的H1下方。示例1：以...

📅  最后修改于: 2021-05-25 18:05:09        🧑  作者: Mango

巨无霸是一个大的灰色框，用于指示一些文本，需要特别注意。任何看起来很重要的文字都可以写在巨型电子书内，以使其显得大而引人注目。添加jumbotron的步骤：在div元素内使用jumbotron类。在div标签内写任何文本。关闭div元素。句法：例子：输出：全宽巨无霸：.jumbotron-fluid和.container或.container-fluid类用于创建没有圆形边界的全宽巨无霸。句法：例...

📅  最后修改于: 2021-05-25 18:05:32        🧑  作者: Mango

Bootstrap中的.ml-auto类可用于将导航栏项目向右对齐。.ml-auto类自动将元素右对齐。在本文中，我们将以两种不同的方式将导航栏右对齐，下面将通过适当的示例对这两种方法进行讨论。示例1：在第一个示例中，我们使用Bootstrap 4的.ml-auto类将导航栏项目向右对齐。.ml-auto类自动给定左边距，并将导航栏项目向右移动。程序：输出：示例2：在此示例中，我们不使用任何预定义...

📅  最后修改于: 2021-05-25 18:06:04        🧑  作者: Mango

下面是遇到的问题的示例。这里的按钮标签包括“ form-control”类。表单控件类将合并它的所有元素对齐。该按钮也不例外，因此与文本区域对齐或弯曲。输出Bootstrap 4是Web开发人员用来创建动态和交互式用户界面的最流行的CSS框架之一。 Bootstrap 4捆绑了各种组件，可用于构建引人入胜的网站。这样的组件之一就是用于创建表单设计的表单控件。表单控件类具有预定义的CSS属性，这使得...

📅  最后修改于: 2021-05-25 18:06:36        🧑  作者: Mango

引导程序4中的Flexbox：从引导程序3到引导程序4，发生了惊人的变化，引导程序4可以利用Flexbox来处理内容的布局。FlexBox布局模块使设计灵活的响应式布局结构变得更加容易。方法：使用Directions实用程序将flex项的方向放置在flex容器中。在大多数情况下，您将能够排除水平类，因为浏览器默认为一行。无论如何，您都会遇到需要明确设置此自尊的情况(例如响应式布局)。以下示例表示在...

📅  最后修改于: 2021-05-25 18:07:10        🧑  作者: Mango

为了使网站具有响应能力，聪明的做法是使用Bootstrap。通过使用Bootstrap，我们可以使我们的网站看起来不错且响应迅速。有两种方法可以在响应式导航栏的中心设置图像或徽标。他们是：使用CSS使用引导程序现在让我们了解它们中的每一个。使用CSS：在这种方法中，我们使用自己的样式将图像放在导航栏中。我们将把CSS代码嵌入HTML代码中。在这里，我们为品牌(图片或徽标)赋予了flex属性，其宽度...

📅  最后修改于: 2021-05-25 18:07:54        🧑  作者: Mango

在这篇文章中，我们将使用jQuery实现2人井字游戏。使用一些简单的验证和错误检查是很容易开发的。玩家1开始玩游戏，并且两个玩家都连续进行移动。制作直的3块链的玩家将赢得比赛。在这里，我们将仅使用简单的逻辑和验证检查在前端上实现此游戏。先决条件：一些前端技术(例如HTML，CSS，jQuery和Bootstrap)的基本知识。开发布局：首先，我们将开发3 * 3网格布局，并在其上应用一些CSS效果...

📅  最后修改于: 2021-05-25 18:08:21        🧑  作者: Mango

Bootstrap首次拥有自己的图标库，该图标库是针对引导程序组件和文档进行定制设计和构建的。Bootstrap图标旨在与Bootstrap组件一起使用，从表单控件到导航。引导程序图标是SVG，它们可以快速，轻松地进行缩放，并可以使用CSS进行样式设置。虽然它们是为Bootstrap构建的，但它们会添加任何项目。它们是在MIT许可下开源的，因此您可以根据需要自由下载，使用和自定义。如何安装：引导程...

📅  最后修改于: 2021-05-25 18:08:44        🧑  作者: Mango

Bootstrap提供了一个类来覆盖内容和不同的样式属性，以使其看起来更具吸引力。要使用.nav-bar填充视口或整个屏幕，请更改高度。例子：输出：桌面视图：行动检视：...

📅  最后修改于: 2021-05-25 18:09:10        🧑  作者: Mango

项目名称：创新电子邮件简介：在当今时代，无论是与大学朋友，校长，项目导师还是其他人，互联网都在交流或保持人们联系方面发挥着重要作用。所有这些对话之间的差异是交流的媒介，例如您可以使用Facebook或任何其他社交媒体网站与您的朋友建立联系，但是同时，当您想向校长发送请假申请时，则必须使用电子邮件。该项目旨在使通过电子邮件的对话更加方便。电子邮件主要用作组织内部的通信方法。组织中较高职位的人员每天都...

📅  最后修改于: 2021-05-25 18:09:55        🧑  作者: Mango

表单验证是确认用户在输入字段中输入的相关信息的过程。在这里，我们将使用jQuery验证一个简单的表单，该表单包含用户名，密码和确认密码。先决条件：您必须了解HTML，CSS，JavaScript和jQuery的基础知识。方法：首先，您需要创建一个由Bootstrap 4表单组成的index.html文件，并使用username，email，password和确认password作为输入字段。在“ ...