sjxxxx_

小白学习Java第二十三天＜进入Javaweb＞

课程介绍：

今日内容：

HTML概述
软件架构
HTML语言介绍
HTML入门案例
HTML常见标签

文本标签

媒体标签

超链接

表格

表单

框架

实体字符

div/span

H5新特性

一、HTML概述

HTML用于编写网页，我们日常中通过浏览器网络访问的网页大部分都是使用HTML编写。

通过鼠标右键查看网页源代码就能查看到具体的HTML代码。

网页内容包含：HTML代码、CSS代码、JavaScript代码等内容，俗称网页三剑客。

HTML代码：用于展示数据，即页面内容的呈现；

CSS代码：使页面内容展示不同的效果，即给页面内容化妆；

JavaScript代码：使整个页面显示的元素具有动画的效果，并能与用户实现动态交互；

二、软件架构

目前市场上有两种流行的软件架构：

C/S架构:Client/Server 客户端/服务器。要求用户安装一个客户端程序。

B/S架构：Browser/Server 浏览器/服务器。通过浏览器与服务器交互，不需要安装其他程序。

（一）C/S架构

C/S架构：Client/Server 客户端/服务器。要求用户安装一个客户端程序。

原理图:

主要特点:

交互性强、具有安全的存取模式、网络通信量低、响应速度快、利于处理大量数据。但是该结构的程序是针对性开发，变更不够灵活，维护和管理的难度较大。

常见应用：

qq音乐、王者荣耀、网易云、消消乐

优点：

用户体验好，效果炫

对信息安全的控制较强

应用服务器运行数据负荷较轻，部分计算功能在客户端完成

缺点：

占用硬盘空间

维护麻烦

安装使用依赖其他条件

（二）B/S架构

B/S架构：Browser/Server 浏览器/服务器。通过浏览器与服务器交互，不需要安装其他程序

原理图:

主要特点:

分布性强、维护方便、开发简单且共享性强、总体拥有成本低。但数据安全性问题、对服务器要求过高、数据传输速度慢、软件的个性化特点明显降低。

常见应用：

12306、淘宝、京东...

优点：

维护和升级简单，无缝升级。

不用必须安装程序，操作系统内置了浏览器。大大减少了使用成本

缺点：

动画效果受浏览器限制

对信息安全控制较差。例如：网银就需要使用U盾，在浏览器端加密。

应用服务器运行数据负荷较重。大部分计算都在服务器端，增加服务器压力。使用Ajax可以改善部分用户体验。

（三）资源分类

资源分类分为:

静态资源和动态资源

1、静态资源

静态资源: 使用静态网页技术开发的资源(Html,CSS,JavaScript)

特点：

所有用户访问，得到的结果是一样的。

举例:

文本，图片，音频，视频，Html,CSS,JavaScript都属于静态资源

如果用户请求的是静态资源，那么服务器会直接将静态资源发送给浏览器。浏览器种内置了静态资源的解析引擎，可以展示静态资源浏览器本身也是一个应用程序。

2、动态资源

动态资源: 是从资源的服务器里面的数据库拿出来的, 使用动态网页技术发布的资源。

特点：

所有用户访问，得到的结果可能不一样

举例：

jsp/servlet,php,asp…

如果用户请求的是动态资源，那么服务器会根据用户的需求从数据库获取动态数据，再将数据发送给服务器，与静态页面进行数据绑定转换为静态资源，再发送给客户端浏览器。

三、HTML语言介绍

（一）什么是HTML

HTML:超文本标记语言(Hyper Text Markup Language)。

超文本：一种组织信息的方式，它通过超级链接方法将文本中的文字、图表与其他信息媒体相关联。

简单说不仅可以加载文本还可以加载图片、视频、音频等

标记语言：由标签组成的语言，标记语言不是编程语言。如：...。

（二）HTML作用及版本

作用:

使用标记标签来描述网页，需要运行在浏览器上(推荐使用谷歌、火狐)

版本介绍：

超文本置标语言(第一版)——在1993年6月作为互联网工程工作小组工作草案发布（并非标准）。

HTML 2.0——1995年11月作为RFC 1866发布，在RFC 2854于2000年6月发布之后被宣布已经过时。

HTML 3.2——1996年1月14日，W3C推荐标准

HTML 4.0——1997年12月18日，W3C推荐标准

HTML 4.01（微小改进）——1999年12月24日，W3C推荐标准

HTML 5.0——2008年发布，2012年形成稳定版本。

四、HTML入门案例

（一）HTML基本语法

基本语法包含：标签和属性

文件的后缀：html的后缀名是 .html(推荐使用) 或者 .htm
标签由尖括号包围的关键词，比如
标签分类：① 双边标签：如 ② 单边标签：如
标签的嵌套：要正确嵌套

正确演示：

错误演示：

标签不区分大小写（建议小写）
在开始标签中可以定义属性，属性是以键值对的形式，值需要引号引起来
标签名都是预定义好的，可以直接使用但不可以随便定义
xxx.xml 这样格式的文件，允许自定义标签
html语言的严谨性要弱一些

（二）创建第一个HTML文件

在本地的任意一个位置创建文本文档，将后缀名改成html或者htm

选择使用记事本或任何文本编辑工具打开文件

编写HTML标签

右键文件选择使用任意一个浏览器打开，开始你的HTML之旅吧！

（三）HTML编辑工具

简易编辑工具：记事本、Notepad++、EditPlus

集成开发工具：HBuilder、Webstorm(收费)、Sublime、VSCode。

使用VSCode开发第一个页面

步骤:

先创建一个文件当做项目的工作空间, 然后使用VSCode引入文件路径

2 . 创建项目名

3. 在项目下创建文件

4. 安装使用默认浏览器插件, 然后右键执行（快捷键ALT+B）

HTML基本文档结构如下:

1. ：声明文档类型

2. html：html文档的根标签

3. head: 头标签，用于指定html一些属性和引入外部资源

4. title：标题标签，设置当前页面的标题

5. meta标签：指定当前页面的字符编码

6. body：体标签，显示在页面中内容

7. 注释：

五、HTML常见标签

常见标签分类介绍：

文本标签、多媒体标签、列表标签、链接标签、表格标签、表单标签、框架标签、字符实体等。

（一）标题标签

HTML提供系列标签，这里的*代表1-6，用于修饰标题，其中

定义最大的标题，
定义最小的标题。

标题标签：
标题1
...
标题6

（二）段落标签

段落标签，使得文本独立成段。

属性解析:

属性名

属性说明

align

段落对齐方式

left左对齐（默认）

center 居中

right 右对齐

文本格式化标签

文本格式化标签:主要用于修饰文本内容的标签。

1、换行标签

换行标签，是一个单标记标签，每次需要换行就添加一个
标签，换几行加几个。

2、分割线标签

标签在HTML页面中创建一条水平的分割线，用于定义内容的主题变化。

属性解析:

属性名	属性说明
width	定义水平线的长短单位是像素/百分比
size	定义水平线的粗细单位是像素/百分比
color	定义水平线的颜色颜色可以是英文单词：例如red,blue,yellow,pink 颜色也可以是编码：#FF0000

3、加粗标签

> 、标签可以使字体加粗。

4、斜体标签

、标签可以使字体倾斜。

5、上标标签

2⁵ 可以表示为25

下标标签

H_{2_O}可以表示为H2O

7、字体格式化标签

用于设置字体尺寸、字体颜色等。

属性解析:

属性名

属性说明

size

定义字体大小, 默认大小3号。

取值范围:1~7

1号最小，7号最大

color

设置字体的颜色

颜色可以是英文单词：例如red,blue,yellow

颜色也可以是编码：#FF0000

8、居中标签

居中标签:
标签用于将文本居中显示。

（五）HTML多媒体标签

1、HTML图片标签

如果我们想要在HTML网页中展示图片，首先需要准备好图片，格式不限，jpg、png、gif 均可。

标签:

通常情况我们会将图片copy到项目的img文件夹下：

属性解析：

属性名

属性说明

src

设置图片的引用路径，可以是相对路径或绝对路径

相对路径

    ./ 当前目录

../ 上一级目录

../../ 上上一级目录

2. 绝对路径

网络绝对路径：通过url地址加载资源如：https://timgsa.baidu.com/timg?image/xx.png

磁盘绝对路径需要通过本地访问该页面如：D:\\images\\1.jpg

width

设置图片的宽度，以像素为单位。

height

设置图片的高度，以像素为单位

title

悬浮文字，当鼠标悬浮到图片上时的提示文字

alt

替代文本，由于某种原因图片无法显示时会使用替代文本替代图片内容。

2、HTML音频标签

标签定义声音，比如音乐或其他音频流。

子标签，资源意思

属性解析:

属性名

属性说明

src

要播放的音频的 URL，是source标签的属性

controls

如果出现该属性，则向用户显示控件，比如播放按钮

autoplay

如果出现该属性，则音频在就绪后马上播放。

loop

如果出现该属性，则每当音频结束时重新开始播放

muted

规定视频输出应该被静音

代码示例：

效果演示：

3、HTML视频标签

标签定义视频，比如电影片段或其他视频流。

子标签

属性解析:

属性名

属性说明

src

要播放的视频的 URL

controls

如果出现该属性，则向用户显示控件，比如播放按钮

height

设置视频播放器的高度

width

设置视频播放器的宽度

loop

如果出现该属性，则当媒介文件完成播放后再次开始播放

muted

规定视频的音频输出应该被静音

autoplay

如果出现该属性，则视频在就绪后马上播放。

代码示例：

效果演示：

（六）HTML列表标签

定义无序列表
定义有序列表
列表项, 是ul和ol的子标签

特别说明：

    ul和ol标签都有type属性，可以用来设置列表项前面的项目符号类型。

属性解析:

属性名

属性说明

type

定义列表的符号类型。

有序列表：取值：A、a 、I 、i 、1 等(默认type="1")

无序列表：取值：disc 实心圆、square 方块、circle 空心圆(默认type="disc")

（七）超链接标签

超链接标签是在html页面中提供一种页面间跳转的方式。

语法结构：

目标地址” target=”目标”>热点文字或图片

属性解析：

属性名

属性说明

href

访问目标的url地址（必填）

地址取值:

目标路径或者锚点

target

定义打开页面的方式 ,常用的两种方式取值为：

取值：

_blank 在新的选项卡中打开

_self 在本页面打开（默认）

（八）HTML表格标签

2.1、表格标签

HTML中一个表格由
标签及一个或多个加若干
标签组成。

table:表格容器标签

tr：行

td: 列（单元格）

语法格式：






常用标签:

标签名

作用

table

父标签，相当于表格的容器

tr

用来定义行，写在
标签内
标签内

td

用来定义列（单元格），写在

th

表格的列标题: 加粗，居中

caption

表格的标题

thead

标签定义表格的表头

tbody

标签表格主体(正文)。该标签用于组合 HTML 表格的主体内容

tfoot

标签定义表格的页脚（脚注或表注）。该标签用于组合 HTML 表格中的表注内容。

属性解析：

属性名

属性说明

border

表格边框的宽度(粗细)

width

表格的宽度

height

表格的高度

align

可以用在
标签中，表示表格相对于整个浏览器窗口的居中对齐；也可用在或
标签中，设置单元格内容的对齐方式

取值：left 居左、right 居右、center 居中

bgcolor

表格的背景颜色(table/tr/td 小的会覆盖大的)

rowspan

合并行（跨行）只能用在td/th

colspan

合并列（跨列）只能用在td/th

cellspacing

单元格之间的空白

cellpadding

表格边缘与内容之间的空白

普通案例代码1：

DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>表格标签title>

head>

<body>



   <table border="1px"  align="center" width="400px" cellspacing="0px" cellpadding="10px" bgcolor="green">

       <tr align="center" bgcolor="orange">

           <td>姓名td>

           <td>年龄td>

           <td>爱好td>

       tr>

       <tr  align="center">

           <td bgcolor="red">张三td>

           <td>23td>

           <td>唱歌td>

       tr>

       <tr  align="center">

           <td>李四td>

           <td>24td>

           <td>跳舞td>

       tr>

       <tr  align="center">

           <td>王五td>

           <td>25td>

           <td>爬山td>

       tr>

   table>

body>

html>

跨行跨列表格代码2：

DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>跨行跨列的表格标签title>

head>

<body>

   <table border="1px" width="500px">

       <caption><h2>学生信息表h2>caption>

       <tr align="center">

           <th>学号th>

           <th>姓名th>

           <th>性别th>

           <th>个人简介th>

       tr>

       <tr align="center">

           <td>1001td>

           <td>张三td>

           <td>男td>

           <td>我学习最好td>

       tr>

       <tr align="center">

           <td>1002td>

           <td>李四td>

           <td>男td>

           <td rowspan="2">我是一名演员td>

       tr>

       <tr align="center">

           <td>1003td>

           <td>王五td>

           <td>女td>

       tr>

       <tr align="center">

           <td>1004td>

           <td colspan="2">小六td>

           <td>小绵阳td>

       tr>

   table>

body>

html>

（九）HTML表单标签

表单的作用：HTML 表单的主要作用是接收用户的输入，当用户提交表单时，浏览器将用户在表单中输入的数据打包，并发送给服务器，从而实现用户与Web服务器的交互。

表单是控件的容器，一个表单由form元素、表单控件和表单按钮三部分组成。

2、案例相关标签

2.1、表单标签

是在页面中创建出一个表单，表单标签在HTML中是没有效果展示的，能展示的是表单中的各种标签。如果数据需要提交给服务器，负责收集数据的标签必须放在表单之中。

表单控件和表单按钮

属性解析:

属性名

属性说明

action

数据提交的路径，指向数据提交的服务器地址

method

数据提交的方式，常用取值：get、post

enctype

规定在发送到服务器之前应该如何对表单数据进行编码

取值三种方式:

application/x-www-form-urlencoded:默认的编码方式。但在用文本的传输和MP3等大型文件的时候，使用这种编码就显得效率低下(也就是说上传文本格式的文件)。

multipart/form-data:指定传输数据为二进制类型，比如图片，mp3，文件，文件上传时使用。

text/plain：纯文本的传输。空格转换为"+"号，但不对特殊字符编码。

2.2、输入域标签

标签用于获取用户输入信息，通过指定type值达到搜集不同信息的目的。是我们在html中最常用的标签。

语法：

input属性：

属性名

属性说明

id

为当前组件提供一个唯一的标识

type

定义表单输入项input的组件类型

详见下一个表格type属性值说明

name

为当前组件提供一个名称

服务器会根据当前的名称获取当前组件提供的数据

value

为当前组件设置值。

value属性的设置策略：

①文本框、密码框这样的表单输入项，可以不强制指定value，因为用户可以自由输入

②单选框、复选框这样的表单输入项，必须强制指定value，因为用户无法输入，只能选择，如果不指定value，那么提交上去的只有on

checked

设置单选框/复选框的默认选中状态（全选、反选）

readonly

设置该标签的参数值只读，用户无法手动更改。

但是数据是可以正常提交

disabled

设置该标签不可用（禁用），参数值无法更改，且参数值也无法提交

size

组件的长度

maxlength

设置允许输入的最大的长度

placeholder

输入框的提示信息

input-type属性值说明:

属性值

说明

text

文本框(默认)，单行的输入字段，用户可在其中输入纯文本。

password

密码框。内容为非明文

radio

单选框。必须将其设置为同一组(name的名字必须相同)

checkbox

复选框。必须将其设置为同一组(name的名字必须相同)

file

附件框。用于文件上传。

hidden

隐藏域。数据可以通过表单发送至服务器，但是浏览器不会显示。

submit

提交按钮。用于控制表单提交数据。

name属性一般不用设置，设置value属性将按钮起一个名字

reset

重置按钮。用于将所有的表单输入项恢复到 默认状态

image

图形提交按钮，与submit按钮等价

button

普通按钮。需要和JavaScript事件一起用

2.3、下拉列表标签：



属性解析:

属性值

说明

name

下拉列表框的名字。

属性selected选中项、value为当前下拉项的值

multiple

multiple 属性规定输入字段可选择多个值

2.4、文本域标签

写法格式:

HTML提供了多行输入的文本控件

属性解析:

属性值

说明

cols

设置文本域的列数

rows

设置文本域的行数

注意:如果需要固定文本域行列的大小,需要使用CSS样式固定;

<style>

     textarea {

         resize: none;

     }

style>

2.5、按钮标签

标签之间的所有内容都是按钮的内容，其中包括任何可接受的正文内容，比如文本或多媒体内容。例如，我们可以在按钮中包括一个图像和相关的文本，用它们在按钮中创建一个吸引人的标记图像。

完整代码：

DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>表单标签title>

    <style>

        textarea{

            resize: none;

        }

    style>

head>

<body>



   <form name="regist" action="demo02-标题标签.html" method="post" >

        <p>账号:<input name="username" type="text" maxlength="4" placeholder="请输入账号">p>

        <p>密码:<input name="password" type="password">p>

        <p>性别:



            <input name="sex" type="radio" checked="checked" value="男">男

            <input name="sex" type="radio" value="女">女

        p>

        <p>

            爱好:

            <input name="hobby" type="checkbox" value="唱歌">唱歌

            <input name="hobby" type="checkbox" value="跳舞">跳舞

            <input name="hobby" type="checkbox" value="打篮球">打篮球

            <input name="hobby" type="checkbox" value="rap">rap

        p>

        <p>

            头像:<input name="pic" type="file">

            <input type="hidden" name="id" value="">

        p>

        <p>

            城市:

            <select name="city" id="city">

                <option value="0">==请选择==option>

                <option value="北京">北京option>

                <option value="上海">上海option>

                <option value="杭州" selected="selected">杭州option>

            select>

        p>

        <p>

            个人简介:<br>

            <textarea name="introduce" id="introduce" cols="30" rows="3">textarea>

        p>

        <p>

            <input type="button" name="btn" value="提交">

            <input type="submit" name="sub" value="注册">

            <input type="reset" name="ret" value="重置">

            <input type="image" name="btnimg" src="img/btn.jpg" width="100px" height="80px" value="abc">

        p>

        <button><img src="img/btn.jpg" alt="">button>

   form>

body>

html>

（十）HTML框架标签

1、框架可以使页面分开布局

2、案例相关标签

2.1、框架标签

写法格式:

框架标签标签是在本页面内用多窗口将多个页面整合在一起的一个框架集。每一个页面都是独立的，需要用子标签来确定页面的位置。通过行和列控制整体布局，用cols确定列数，用rows确定行数。

特别注意事项:

标签与标签不能同时共存

属性解析:

属性值

说明

cols

对页面进行列切割

一般我们用百分比确定比例，最后一个值用*匹配剩余量

单位：像素/百分比

rows

对页面进行行切割

一般我们用百分比确定比例，最后一个值用*匹配剩余量

单位：像素/百分比

问题: 框架标签是否可以嵌套? 答: 可以

效果演示:

2.2、框架子标签

标签是标签的子标签, 用于页面引入.

属性解析：

属性名

属性说明

src

指定页面的路径

noresize

框架分割后禁止调整

name

该框架的名称

用于和a标签target连用

案例代码：

第一步：创建框架集页面，注意没有body标签

第二步：创建子页面top.html,left.html,右侧需要显示页面

top.html

left.html:

右侧:

注意：左侧导航链接时打开的内容位置

给右侧框架起个名字：

修改left.html页面中链接标签的target属性：

（十一）实体字符

有些字符，像(<)这类的，对HTML来说是有特殊意义的，所以这些字符是不允许在文本中使用的。要在HTML中显示(<)这个字符，我们就必须使用实体字符。

实体字符语法：&实体字符名;

实体字符表:

字符实体语法结构：

&实体名称;

常见的实体字符有：

空格：   小于符号：< 大于符号：> 双引号："   版权符号：©

（十二）DIV标签与Span标签

DIV是一个块级元素, 默认没有任何样式, 需要配合CSS一起使用才能发挥作用,用div+css可以制作出精美的网页;

扩展: 介绍一个块级标签(行内标签): span

总结:

DIV是一个块级元素, 它包含的元素会自动换行, 单独占一行;

Span是一个行内元素, 它包含的元素不会自动换行, 有多少内容就占多少空间;

（十三）HTML5新特性

什么是 HTML5？

HTML5 是最新的 HTML 标准。

HTML5 是专门为承载丰富的 web 内容而设计的，并且无需额外插件。

HTML5 拥有新的语义、图形以及多媒体元素。

HTML5 提供的新元素和新的 API 简化了 web 应用程序的搭建。

HTML5 是跨平台的，被设计为在不同类型的硬件（PC、平板、手机、电视机等等）之上运行。

为了更好地处理今天的互联网应用，HTML5添加了很多新元素及功能，比如: 语义标签，多媒体内容，更好的页面结构，更好的形式处理等。

常见语义标签:

：描述了文档的头部区域，用于定义内容的介绍展示区域

：定义元素规定独立的自包含内容。

：述了文档的底部区域，一个页脚通常包含文档的作者，著作权信息，链接的使用条款，联系信息等。

你可能感兴趣的:(Java小白,javascript,前端,开发语言)

基于Python+Django的可视化学习系统设计与实现（毕业设计源码+技术文档+系统部署）逐梦设计 Python毕业设计实战案例 python django 课程设计 vue.js 毕业设计源码
博主简介作者简介：Java领域优质创作者、CSDN博客专家、CSDN内容合伙人、掘金特邀作者、阿里云博客专家、51CTO特邀作者、多年架构师设计经验、多年校企合作经验，被多个学校常年聘为校外企业导师，指导学生毕业设计并参与学生毕业答辩指导，有较为丰富的相关经验。期待与各位高校教师、企业讲师以及同行交流合作主要内容：Java项目、Python项目、前端项目、PHP、ASP.NET、人工智能与大数据、

【前端构建】使用Docker打包多个前端项目到一个Nginx镜像，并给conf文件动态传递参数 Zacks_xdc 前端 docker nginx
提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录背景正文DockerFileNginx配置模板接收变量并替换Shell脚本将Nginx配置模板替换成配置文件使用构建镜像运行容器总结背景公司给一些客户要部署三个前端项目。最初，每个前端项目都以独立的镜像形式交付并部署。然而，随着客户数量的增加，每个客户都提出了一些自定义需求，后端也进行了对应改造。这导致了部署过程变得复杂且繁琐

JavaScript 案例购物车《嘘》安静 javascript 前端开发语言
思路：1、获取页面元素，本练习用的表格table实现2、声明一个数组，包含自己需要渲染的内容，每个内容需要声明一个默认值，便于之后用来判断是否被勾选3、封装渲染函数：通过遍历每一个元素，判断勾选状态，如果被勾选，就直接添加选中属性，没有则正常添加。4、接着遍历元素的每一个键，并分别赋值给每一个td。5、判断合计金额，每次遍历完成后，需要把被勾选的元素单价*数量并赋值给总价的元素。6、最后直接渲染到

JavaScript 案例留言板《嘘》安静 javascript css html
思路1、设置点击事件。点击留言按钮获取本地储存并转为数组。2、判断本地储存是否有值，如果有获取最后一个元素的id，如没有就把他赋值为一个新数组，把id值赋为1.3、在判断文本框是否有值，有值才能操作。4、调用时间函数，得到当前时间，当前用户名，以及当前内容以对象的方式存入数组。5、调用渲染函数，每次调用都把留言框的值为空，让他重新获取重新渲染。6、获取本地储存的数据数组，遍历每一个元素，就创建一个

JS严格模式：全面解析与开发实践努力的小朱同学 JavaScript基础 javascript 前端面试
一、简介在某些JS代码中，开头会有一行"usestrict"，这表达什么意思呢？其实，“usestrict”是一种严格模式指令（StrictMode），是采用具有限制性JavaScript变体的一种方式，于2009年的ES5规范中首次引入，并在后续规范中不断完善。严格模式对正常的JS语法进行了限制，如：通过抛出错误来消除了一些原有静默错误；修复了一些导致JS引擎难以执行优化的缺陷，使代码运行速度更

前端简单数据存储：跳过后端数据库的一种高效策略，应对一些不需要后端访问数据库的简单操作：静态 Markdown 文件存储【D＇accumulation】前端数据库学习 vscode html5 vue.js
问题提出：在一些应用场景中，有些数据并不重要，也不需要频繁地进行动态增删改查，比如品牌历史、产品介绍等说明性内容。为此，我选择在前端直接存储这些静态数据，跳过后端数据库调用。本文将分享如何利用Vue工程中直接存放Markdown文件与内嵌数据，将数据管理与业务逻辑解耦，从而实现快速开发、便于维护和灵活更新的目的。静态Markdown文件存储方法案例：原理：将Markdown文件（如brandHis

AMD异步模块介绍【D＇accumulation】前端学习
基本介绍AMD（AsynchronousModuleDefinition，异步模块定义）是一种用于JavaScript模块化编程的规范，它允许JavaScript代码以异步方式加载模块及其依赖。它最初是为了解决浏览器端JavaScript代码模块化的问题，最著名的实现是RequireJS。AMD出现背景JavaScript发展初期，所有代码都写在一个.js文件里，或者通过有哪些特点AMD主要用于浏

LLM大模型提示工程Prompt Engineering Langchain prompt langchain 私有化大模型人工智能产品经理 ai大模型 LLM
在LLM中影响词汇的分布主要通过两种方式，一种是通过提示（Prompting），另外一种就是通过训练（Training）。提示是影响词汇分布最简单的方法，通过给LLM输入提示文本（有时会包含指令和示例）使得词汇的分布概率发生变化。以上一篇中提到的例子说明，最初的语句是“我写信给农场，希望他们送我一个宠物，他们送给我一只（）“词汇的分布如下：代码语言：javascript**复制牛0.1羊0.2狗0

WebAssembly 与 JavaScript：高性能 Web 开发的未来 vvilkim JavaScript 现代WEB技术 wasm javascript 开发语言
在现代Web开发中，性能始终是一个关键问题。随着Web应用变得越来越复杂，开发者需要更高效的工具和技术来满足用户对速度和响应能力的需求。WebAssembly（简称Wasm）正是为此而生。它是一种低级的二进制指令格式，旨在为Web提供接近原生代码的执行性能。与此同时，它与JavaScript的关系也备受关注。本文将深入探讨WebAssembly是什么，以及它与JavaScript如何协同工作。什么

详细说明脚本评估和耗时较长的任务混血哲谈性能优化
在网页性能优化中，脚本评估和耗时较长的任务是两大关键性能瓶颈。它们直接影响页面的加载速度、交互响应以及用户体验。以下是对这两个概念的详细说明及优化策略：一、脚本评估（ScriptEvaluation）1.定义脚本评估指浏览器解析（Parsing）、编译（Compiling）和执行（Executing）JavaScript代码的全过程。这一过程通常包括：解析：将文本形式的JavaScript代码转换

JavaScript（JS）单线程影响速度 ok060 javascript 开发语言 ecmascript
js单线程影响速度在JavaScript（JS）中，单线程的本质是其执行模型的核心特点，这意味着同一时间只能执行一个任务。这种设计使得JS在处理诸如DOM操作、用户交互等任务时更为直观和安全，因为它避免了复杂的多线程并发问题，如竞态条件（raceconditions）和死锁（deadlocks）。然而，单线程的特性也确实影响了其处理大量计算或I/O密集型任务时的性能。影响速度的原因阻塞性操作：在单

前端vscode中好用的scss插件推荐熊宝王前端 vscode scss
一、LiveSassCompilerLiveSassCompiler是VisualStudioCode(VSCode)中非常流行的一个插件，用于将Sass/SCSS文件实时编译为标准的CSS文件。Sass（SyntacticallyAwesomeStyleSheets）是一种CSS预处理器，提供了变量、嵌套、混合（Mixins）、继承等强大功能，而LiveSassCompiler插件可以帮助开发者

React Native：跨平台移动应用开发的强大框架冬冬小圆帽 react native react.js javascript
ReactNative介绍ReactNative是由Facebook开发并开源的一款基于JavaScript和React的跨平台移动应用开发框架。它允许开发者使用React的语法和组件模型来构建原生移动应用（iOS和Android）。ReactNative的核心思想是“LearnOnce,WriteAnywhere”，即学习一次，编写多端应用。1.核心特点跨平台开发：使用JavaScript和Re

SpringSecurity——如何获取当前登录用户的信息代码代码快快显灵 springsecurity java 开发语言 SpringSecurity
目录1.直接注入Principal2.直接注入Authentication3.注入UsernamePasswordAuthenticationToken4.通过SecurityContextHolder获取5.使用自定义工具方法总结如何获取更多的用户信息自定义用户实体类如何忽略某些字段（不返回前端）以及规范日期格式登录成功后的处理：在SpringSecurity中，当前登录用户的信息实际上都存储在

分享：Javascript开源桌面环境-Puter ac-er8888 javascript 开发语言 ecmascript
Puter这是一个运行在浏览器里的桌面操作系统，提供了笔记本、代码编辑器、终端、画图、相机、录音等应用和一些小游戏。该项目作者出于性能方面的考虑没有选择Vue和React技术栈，而是采用的JavaScript和jQuery构建，支持Docker一键部署和在线使用。简介：Puter是一个先进的开源项目，旨在为用户提供全新的云端体验。它可以在浏览器中运行，无需安装，即可提供丰富的功能和极快的速度。功能

前端页面列表白线问题解决方案松岛的枫叶前端 vue.js elementui
/*完全消除行间边框*/.el-table{--el-table-border-color:transparent!important;}.el-tabletd.el-table__cell{border-bottom:none!important;}.el-tableth.el-table__cell.is-leaf{border-bottom:none!important;}.el-table

前端面试常见的计算机网络内容梳理 GISer_Jinger 前端 javascript
前端面试常见的计算机网络内容梳理，我得从搜索结果里找相关的信息。先看看各个网页的内容。网页1和网页2主要讲OSI模型、TCP/IP模型，ARP、DNS、TCP/UDP区别这些基础概念，这些都是常考的点。网页3提到了TCP三次握手、HTTP缓存、跨域方法，还有CDN原理，这些都是前端面试的重点。网页4详细讨论了HTTP请求方法、状态码、请求头和响应头，这些内容也很关键。网页5提到了HTTPS加密原理

babel 埋点插件小猫儿工具环境配置等 javascript 开发语言 ecmascript
我们通常对babel的理解就是它可以帮助我们去处理兼容性，也就是有些JavaScript的新特性，可能我们想去使用，但对于某些浏览器来说还并未支持，此时我们就可以通过babel将我们的代码降级处理为浏览器兼容的执行版本，以便能够运行在当前和旧版本的浏览器或其他环境中。Babel插件就是作用于抽象语法树。Babel三个主要的处理步骤就是解析（parse），转换（transform），生成（gener

开源前端埋点监控插件Web-Tracing 研创通之逍遥峰开源工具开源前端
Web-Tracing是一款专为前端项目设计的前端监控插件，它基于JavaScript设计，兼容跨平台使用，并提供了全方位的监控功能。开源地址：https://gitee.com/junluoyu/web-tracing-analysis以下是关于Web-Tracing的详细介绍：一、主要功能Web-Tracing涵盖了多个领域的监控手段，包括但不限于：埋点：通过事件监听，实现对用户交互行为的精准

前端实现埋点&监控 Cipher_Y 前端
前端实现埋点&监控实现埋点功能的意义主要体现在以下几个方面：数据采集：埋点是数据采集领域（尤其是用户行为数据采集领域）的术语，它针对特定用户行为或事件进行捕获、处理和发送的相关技术及其实施过程。通过埋点，可以收集到用户在应用中的所有行为数据，例如页面浏览、按钮点击、表单提交等。数据分析：采集的数据可以帮助业务人员分析网站或者App的使用情况、用户行为习惯等，是后续建立用户画像、用户行为路径等数据产

分片文件异步合并上传零三零等哈来 java spring 前端
对于大文件，为了避免上传导致网络带宽不够用，还有避免内存溢出，我们采用分片异步上传。controller层，在前端对文件进行分片，先计算文件md5码，方便后续文件秒传，然后再计算可以分成多少个分片，得到分片总数以及当前分片下标。@RequestMapping("/uploadFile")@SentinelResource(value="uploadFile",blockHandler="uploa

TDengine 入坑 xijieyu tdengine docker linux
的最近想折腾一个时序数据库，所以入坑了TDengine我的环境是WIN10+虚拟机ubuntu，开发语言是C#。在虚拟机里一开始使用docker来拉取TDengine镜像，后来发现docker的网络配置不熟，所以干脆直接在宿主机上安装TDengine直接使用。安装完了后，taos怎么都连接不上，显示"Unabletoestablishconnection"，根据官方教程中的解释，一步一步排除各类连

Visual Studio Code官网下载地址及使用技巧（含常用的拓展插件推荐） ITCTCSDN vscode ide 编辑器
VisualStudioCode（简称“VSCode”）是Microsoft于2015年4月发布的可运行于MacOS、Windows和Linux之上的跨平台源代码编辑器，它具有对JavaScript，TypeScript和Node.js的内置支持，并具有丰富的其他语言（例如C++，C＃，Java，Python，PHP，Go）和运行时（例如.NET和Unity）扩展的生态系统。VisualStudi

ts之变量声明以及语法细节，ts小白初学ing 菥菥爱嘻嘻小白学习ts typescript 前端
TypeScript用js编写的项目虽然开发很快，但是维护是成本很高，而且js不报错啊啊啊啊啊！！！以js为基础进行扩展的给变量赋予了类型语法、实战(ts+vue3)TypeScript是JavaScript的一个超集，支持ECMAScript6标准（ES6教程）。TypeScript由微软开发的自由和开源的编程语言，在JavaScript的基础上增加了静态类型检查的超集。TypeScript设计

Node.js 如何发布一个 NPM 包——详细教程还是鼠鼠 node.js npm 前端 node.js vscode
在本文中，我将带大家一步步学习如何创建并发布一个NPM包，帮助开发者理解整个流程，并能顺利将自己的JavaScript库发布到NPM上供他人使用。1.安装Node.js和npm在开始之前，请确保你的电脑上已经安装了Node.js和npm（Node.js自带npm）。你可以在终端（Windows用户请使用cmd或PowerShell）输入以下命令检查是否已安装：node-vnpm-v如果出现版本号，

【前端】实操tips集合 JAMJAM_NoName 前端学习前端 javascript 开发语言
1.关闭vue中组件名字的多词校验(1)package.json文件中修改eslint配置"eslintConfig":{"rules":{"vue/multi-word-component-names":"off"}},（2）.eslintrc.js或者.eslintrc配置文件中进行配置module.exports={rules:{'vue/multi-word-component-names

前端技术学习记录：react+dvajs+ant design实现暴走计算器的页面重构（二）大泡泡糖学习记录 reactjs 前端 git webstorm
前端技术学习记录：react+dvajs+antdesign实现暴走计算器的页面重构（二）前言定义Modelconnect起来更新state拥抱变化主题切换更换页面获取当前设备类型编写武学选择前言www定义Model完成UI后，现在开始处理数据和逻辑。dva通过model的概念把一个领域的模型管理起来，包含同步更新state的reducers，处理异步逻辑的effects，订阅数据源的subscr

包管理工具她的双马尾 JS javascript 包管理工具 npm yarn pnpm
JavaScript包管理工具对比：npm、yarn和pnpm1.npm1.1历史与背景npm（NodePackageManager）是Node.js的默认包管理工具，首次发布于2010年。它是JavaScript生态系统中最早的包管理工具，主要用于管理和共享JavaScript模块。目前，npm拥有全球最大的JavaScript包注册中心（npmregistry），包含数百万个开源包。1.2核心

uniapp Deepsleep. uni-app
uni-app是一个使用Vue.js开发所有前端应用的框架，可以编译到iOS、Android、H5、以及各种小程序等多个平台。以下是uni-app页面生命周期的详细介绍，包括一些简单的示例：初始化阶段onLoad(options)触发时机：页面加载时触发，且只触发一次。参数：options是一个包含页面路径参数的对象。示例：从上一个页面传递参数到当前页面。onLoad(options){conso

开发语言漫谈-groovy 大道不孤,众行致远技术杂谈开发语言
groovy是一门脚本语言，在前期的脚本语言中简单介绍了下。现在再深入介绍下，因为它是本平台上选用的脚本语言。所谓脚本语言就是不用编译，直接执行。这种特色非常适合做嵌入编程，即编即用。我们知道平台后台的业务开发语言是Java，开发人员都熟悉Java。那么使用groovy就是自然而然的事情，因为groovy最大特点就是和Java兼容。然后做了最有意义的改造：1、可以解释执行；2、增加动态类型。发明人

redis学习笔记——不仅仅是存取数据 Everyday都不同 returnSource expire/del incr/lpush 数据库分区 redis
最近项目中用到比较多redis，感觉之前对它一直局限于get/set数据的层面。其实作为一个强大的NoSql数据库产品，如果好好利用它，会带来很多意想不到的效果。（因为我搞java，所以就从jedis的角度来补充一点东西吧。PS：不一定全，只是个人理解，不喜勿喷） 1、关于JedisPool.returnSource(Jedis jeids) 这个方法是从red

SQL性能优化-持续更新中。。。。。。 atongyeye oracle sql
1 通过ROWID访问表--索引你可以采用基于ROWID的访问方式情况,提高访问表的效率, , ROWID包含了表中记录的物理位置信息..ORACLE采用索引(INDEX)实现了数据和存放数据的物理位置(ROWID)之间的联系. 通常索引提供了快速访问ROWID的方法,因此那些基于索引列的查询就可以得到性能上的提高. 2 共享SQL语句--相同的sql放入缓存 3 选择最有效率的表

[JAVA语言]JAVA虚拟机对底层硬件的操控还不完善 comsci JAVA虚拟机
     如果我们用汇编语言编写一个直接读写CPU寄存器的代码段，然后利用这个代码段去控制被操作系统屏蔽的硬件资源，这对于JVM虚拟机显然是不合法的，对操作系统来讲，这样也是不合法的，但是如果是一个工程项目的确需要这样做，合同已经签了，我们又不能够这样做，怎么办呢？那么一个精通汇编语言的那种X客，是否在这个时候就会发生某种至关重要的作用呢？ &n

lvs- real 男人50 LVS
#!/bin/bash # # Script to start LVS DR real server. # description: LVS DR real server # #. /etc/rc.d/init.d/functions VIP=10.10.6.252 host='/bin/hostname' case "$1" in sta

生成公钥和私钥 oloz DSA 安全加密
package com.msserver.core.util; import java.security.KeyPair; import java.security.PrivateKey; import java.security.PublicKey; import java.security.SecureRandom; public class SecurityUtil {

UIView 中加入的cocos2d，背景透明 374016526 cocos2d glClearColor
要点是首先pixelFormat:kEAGLColorFormatRGBA8，必须有alpha层才能透明。然后view设置为透明glView.opaque = NO;[director setOpenGLView:glView];[self.viewController.view setBackgroundColor:[UIColor clearColor]];[self.viewControll

mysql常用命令香水浓 mysql
连接数据库 mysql -u troy -ptroy 备份表 mysqldump -u troy -ptroy mm_database mm_user_tbl > user.sql 恢复表（与恢复数据库命令相同） mysql -u troy -ptroy mm_database < user.sql 备份数据库 mysqldump -u troy -ptroy

我的架构经验系列文章 - 后端架构 - 系统层面 agevs JavaScript jquery css html5
系统层面：高可用性所谓高可用性也就是通过避免单独故障加上快速故障转移实现一旦某台物理服务器出现故障能实现故障快速恢复。一般来说，可以采用两种方式，如果可以做业务可以做负载均衡则通过负载均衡实现集群，然后针对每一台服务器进行监控，一旦发生故障则从集群中移除；如果业务只能有单点入口那么可以通过实现Standby机加上虚拟IP机制，实现Active机在出现故障之后虚拟IP转移到Standby的快速

利用ant进行远程tomcat部署 aijuans tomcat
在javaEE项目中，需要将工程部署到远程服务器上，如果部署的频率比较高，手动部署的方式就比较麻烦，可以利用Ant工具实现快捷的部署。这篇博文详细介绍了ant配置的步骤（http://www.cnblogs.com/GloriousOnion/archive/2012/12/18/2822817.html），但是在tomcat7以上不适用，需要修改配置，具体如下： 1.配置tomcat的用户角色

获取复利总收入 baalwolf 获取
public static void main(String args[]){ int money=200; int year=1; double rate=0.1; &

eclipse.ini解释 BigBird2012 eclipse
大多数java开发者使用的都是eclipse，今天感兴趣去eclipse官网搜了一下eclipse.ini的配置，供大家参考，我会把关键的部分给大家用中文解释一下。还是推荐有问题不会直接搜谷歌，看官方文档，这样我们会知道问题的真面目是什么，对问题也有一个全面清晰的认识。 Overview 1、Eclipse.ini的作用 Eclipse startup is controlled by th

AngularJS实现分页功能 bijian1013 JavaScript AngularJS 分页
对于大多数web应用来说显示项目列表是一种很常见的任务。通常情况下，我们的数据会比较多，无法很好地显示在单个页面中。在这种情况下，我们需要把数据以页的方式来展示，同时带有转到上一页和下一页的功能。既然在整个应用中这是一种很常见的需求，那么把这一功能抽象成一个通用的、可复用的分页（Paginator）服务是很有意义的。 &nbs

[Maven学习笔记三]Maven archetype bit1129 ArcheType
archetype的英文意思是原型，Maven archetype表示创建Maven模块的模版，比如创建web项目，创建Spring项目等等. mvn archetype提供了一种命令行交互式创建Maven项目或者模块的方式， mvn archetype 1.在LearnMaven-ch03目录下，执行命令mvn archetype:gener

【Java命令三】jps bit1129 Java命令
jps很简单，用于显示当前运行的Java进程，也可以连接到远程服务器去查看 [hadoop@hadoop bin]$ jps -help usage: jps [-help] jps [-q] [-mlvV] [<hostid>] Definitions: <hostid>: <hostname>[:

ZABBIX2.2 2.4 等各版本之间的兼容性 ronin47
zabbix更新很快，从2009年到现在已经更新多个版本，为了使用更多zabbix的新特性，随之而来的便是升级版本，zabbix版本兼容性是必须优先考虑的一点客户端AGENT兼容 zabbix1.x到zabbix2.x的所有agent都兼容zabbix server2.4：如果你升级zabbix server，客户端是可以不做任何改变，除非你想使用agent的一些新特性。 Zabbix代理（p

unity 3d还是cocos2dx哪个适合游戏？ brotherlamp unity自学 unity教程 unity视频 unity资料 unity
unity 3d还是cocos2dx哪个适合游戏？问：unity 3d还是cocos2dx哪个适合游戏？答：首先目前来看unity视频教程因为是3d引擎，目前对2d支持并不完善，unity 3d 目前做2d普遍两种思路，一种是正交相机，3d画面2d视角，另一种是通过一些插件，动态创建mesh来绘制图形单元目前用的较多的是2d toolkit，ex2d，smooth moves，sm2，

百度笔试题：一个已经排序好的很大的数组，现在给它划分成m段，每段长度不定，段长最长为k，然后段内打乱顺序，请设计一个算法对其进行重新排序 bylijinnan java 算法面试百度招聘
import java.util.Arrays; /** * 最早是在陈利人老师的微博看到这道题： * #面试题#An array with n elements which is K most sorted，就是每个element的初始位置和它最终的排序后的位置的距离不超过常数K * 设计一个排序算法。It should be faster than O(n*lgn)。

获取checkbox复选框的值 chiangfai checkbox
<title>CheckBox</title> <script type = "text/javascript"> doGetVal: function doGetVal() { //var fruitName = document.getElementById("apple").value;//根据

MySQLdb用户指南 chenchao051 mysqldb
原网页被墙，放这里备用。 MySQLdb User's Guide Contents Introduction Installation _mysql MySQL C API translation MySQL C API function mapping Some _mysql examples MySQLdb

HIVE 窗口及分析函数 daizj hive 窗口函数分析函数
窗口函数应用场景：（1）用于分区排序（2）动态Group By （3）Top N （4）累计计算（5）层次查询一、分析函数用于等级、百分点、n分片等。函数             说明 RANK()     &nbs

PHP ZipArchive 实现压缩解压Zip文件 dcj3sjt126com PHP zip
PHP ZipArchive 是PHP自带的扩展类，可以轻松实现ZIP文件的压缩和解压，使用前首先要确保PHP ZIP 扩展已经开启，具体开启方法就不说了，不同的平台开启PHP扩增的方法网上都有，如有疑问欢迎交流。这里整理一下常用的示例供参考。一、解压缩zip文件 01 02 03 04 05 06 07 08 09 10 11

精彩英语贺词 dcj3sjt126com 英语
I'm always here             我会一直在这里支持你               &nb

基于Java注解的Spring的IoC功能 e200702084 java spring bean IOC Office


java模拟post请求 geeksun java
一般API接收客户端（比如网页、APP或其他应用服务）的请求，但在测试时需要模拟来自外界的请求，经探索，使用HttpComponentshttpClient可模拟Post提交请求。此处用HttpComponents的httpclient来完成使命。 import org.apache.http.HttpEntity ; import org.apache.http.HttpRespon

Swift语法之 ---- ?和!区别 hongtoushizi ?swift !
转载自： http://blog.sina.com.cn/s/blog_71715bf80102ux3v.html Swift语言使用var定义变量，但和别的语言不同，Swift里不会自动给变量赋初始值，也就是说变量不会有默认值，所以要求使用变量之前必须要对其初始化。如果在使用变量之前不进行初始化就会报错： var stringValue : String //

centos7安装jdk1.7 jisonami jdk centos
安装JDK1.7 步骤1、解压tar包在当前目录 [root@localhost usr]#tar -xzvf jdk-7u75-linux-x64.tar.gz 步骤2：配置环境变量在etc/profile文件下添加 export JAVA_HOME=/usr/java/jdk1.7.0_75 export CLASSPATH=/usr/java/jdk1.7.0_75/lib

数据源架构模式之数据映射器 home198979 PHP 架构数据映射器 datamapper
前面分别介绍了数据源架构模式之表数据入口、数据源架构模式之行和数据入口数据源架构模式之活动记录，相较于这三种数据源架构模式，数据映射器显得更加“高大上”。一、概念数据映射器（Data Mapper）：在保持对象和数据库（以及映射器本身）彼此独立的情况下，在二者之间移动数据的一个映射器层。概念永远都是抽象的，简单的说，数据映射器就是一个负责将数据映射到对象的类数据。 &nb

在Python中使用MYSQL pda158 mysql python
缘由　　近期在折腾一个小东西须要抓取网上的页面。然后进行解析。将结果放到数据库中。　　了解到 Python在这方面有优势，便选用之。　　由于我有台 server上面安装有 mysql，自然使用之。在进行数据库的这个操作过程中遇到了不少问题，这里记录一下，大家共勉。　　 python中mysql的调用　　百度之后能够通过MySQLdb进行数据库操作。

单例模式 hxl1988_0311 java 单例设计模式单件
package com.sosop.designpattern.singleton; /* * 单件模式：保证一个类必须只有一个实例，并提供全局的访问点 * * 所以单例模式必须有私有的构造器，没有私有构造器根本不用谈单件 * * 必须考虑到并发情况下创建了多个实例对象 * */ /** * 虽然有锁，但是只在第一次创建对象的时候加锁，并发时不会存在效率

27种迹象显示你应该辞掉程序员的工作 vipshichg 工作
1、你仍然在等待老板在2010年答应的要提拔你的暗示。 2、你的上级近10年没有开发过任何代码。 3、老板假装懂你说的这些技术，但实际上他完全不知道你在说什么。 4、你干完的项目6个月后才部署到现场服务器上。 5、时不时的，老板在检查你刚刚完成的工作时，要求按新想法重新开发。 6、而最终这个软件只有12个用户。 7、时间全浪费在办公室政治中，而不是用在开发好的软件上。 8、部署前5分钟才开始测试。

按字母分类： A B C D E F G H I J K L M N O P Q R S T U V W X Y Z 其他

首页 - 关于我们 - 站内搜索 - Sitemap - 侵权投诉

版权所有 IT知识库 CopyRight © 2000-2050 E-COM-NET.COM , All Rights Reserved.

属性名	属性说明
src	设置图片的引用路径，可以是相对路径或绝对路径相对路径 ./ 当前目录 ../ 上一级目录 ../../ 上上一级目录 2. 绝对路径网络绝对路径：通过url地址加载资源如：https://timgsa.baidu.com/timg?image/xx.png 磁盘绝对路径需要通过本地访问该页面如：D:\\images\\1.jpg
width	设置图片的宽度，以像素为单位。
height	设置图片的高度，以像素为单位
title	悬浮文字，当鼠标悬浮到图片上时的提示文字
alt	替代文本，由于某种原因图片无法显示时会使用替代文本替代图片内容。

属性名	属性说明
src	要播放的音频的 URL，是source标签的属性
controls	如果出现该属性，则向用户显示控件，比如播放按钮
autoplay	如果出现该属性，则音频在就绪后马上播放。
loop	如果出现该属性，则每当音频结束时重新开始播放
muted	规定视频输出应该被静音

属性名	属性说明
src	要播放的视频的 URL
controls	如果出现该属性，则向用户显示控件，比如播放按钮
height	设置视频播放器的高度
width	设置视频播放器的宽度
loop	如果出现该属性，则当媒介文件完成播放后再次开始播放
muted	规定视频的音频输出应该被静音
autoplay	如果出现该属性，则视频在就绪后马上播放。

小白学习Java第二十三天＜进入Javaweb＞

课程介绍：

今日内容：

一、HTML概述

二、软件架构

（一）C/S架构

（二）B/S架构

（三）资源分类

三、HTML语言介绍

（一）什么是HTML

（二）HTML作用及版本

四、HTML入门案例

（一）HTML基本语法

（二）创建第一个HTML文件

（三）HTML编辑工具

五、HTML常见标签

（一）标题标签

定义最大的标题，定义最小的标题。 标题标签： 标题1...标题6

定义最小的标题。 标题标签：

标题1

标题6

（二）段落标签

（五）HTML多媒体标签

（六）HTML列表标签

（七）超链接标签

（八）HTML表格标签

（九）HTML表单标签

（十）HTML框架标签

案例代码：

（十一）实体字符

（十二）DIV标签与Span标签

（十三）HTML5新特性

定义最大的标题，
定义最小的标题。

标题标签：
标题1
...
标题6

定义最小的标题。

标题标签：