视频链接:https://www.bilibili.com/video/av5862916?from=search&seid=12139895566389560177

我的第一个html

<!DOCTYPE html><!-- 告诉浏览器这是什么类型的文件(可以省略)-->
<html lang="en">
<head>
<meta charset="iso8859-1"><!-- 设置显示到浏览器的格式-->
<title>tittle name</title>
</head>
<body>
HelloWorld!

</body>
</html>

解决浏览器显示乱码问题:将iso8859-1改为utf-8

运行:将上述代码保存为htm或者html格式用浏览器打开就可以看到效果了。

常用元素介绍:

<!DOCTYPE html><!-- 告诉浏览器这是什么类型的文件(可以省略)-->
<html lang="en">
<head>
<meta charset="utf-8"><!-- 设置显示到浏览器的格式-->
<title>tittle name</title>
</head>
<body>
<b>加粗</b><br>
<strong>加粗起强调作用</strong><br>
<i>斜体</i><br>
<em>斜体</em><br>
<br><!--换行-->
<u>下划线</u><br>
<s>删除</s><br>
<a href=https://search.bilibili.com/all?keyword=html target="_blank"> 超链接</a><br><!-- 原窗口跳转至链接-->
<a href=https://search.bilibili.com/all?keyword=html target="_self"> 超链接</a><br><!-- 新建窗口跳转至链接-->

</body>
</html>

  

 列表标签(list):

列表分为有序和无序:ordered list和unordered list

最基础的用法:

    <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>MyFirstPage</title>
</head>
<body>
<ol>
<li>a</li>
<li>b</li>
<li>c</li>
</ol>
<br>
<ol reversed>
<li>a</li>
<li>b</li>
<li>c</li>
</ol>
<ol type="a">
<li>sdfs</li>
<li>sdfs</li>
<li>sdfs</li>
</ol> <ul>
<li>a</li>
<li>b</li>
<li>c</li>
</ul>
</body>
</html>

 

表中有表:

<!DOCTYPE html><!-- 告诉浏览器这是什么类型的文件(可以省略)-->
<html lang="en">
<head>
<meta charset="utf-8"><!-- 设置显示到浏览器的格式-->
<title>tittle name</title>
</head>
<body> <ol type="1" reversed><!-- 逆序有序列表 -->
<li>第一项</li>
<ol type="a">
<li>1.1</li>
<li>1.2</li>
<li>1.3</li>
</ol>
<li>第二项</li>
<ol type="a"><!-- 列表中还可以加表 -->
<li>2.1</li>
<li>2.2</li>
<li>2.3</li>
</ol>
<li>第三项</li>
<ol type="a">
<li>3.1</li>
<li>3.2</li>
<li>3.3</li>
</ol> <ol>
<br> <ul ><!-- 顺序无序列表 -->
<li>第一项</li>
<li>第二项</li>
<li>第三项</li>
<li>第四项</li>
<li>第五项</li>
<ul> </body>
</html>

  

 表格标签:

    <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>MyFirstPage</title>
</head>
<body> <table border="1px" align="center">
<thead>
<tr>
<th>名字</th><!-- table head 表头-->
<th>性别</th>
<th>密码</th>
</tr>
</thead>
<tbody>
<tr>
<td>张三</td>
<td>男</td>
<td>123</td>
</tr>
<tr>
<td>李四</td>
<td>女</td>
<td>456</td>
</tr>
<tr>
<td>王五</td>
<td>男</td>
<td>789</td>
</tr>
</tbody>
<tfoot>
<tr><!-- 表示当前行 -->
<th>名字</th>
<th>性别</th>
<th>密码</th>
</tr>
</tfoot><!-- table foot 表脚-->
</table>
</body>
</html>

 

合并两个单元格可以看视频

 表单标签

<form action="" method ="post"><!--action里面写转的jsp或者相应servlet别名-->

<br/>
账号:<input type="text" placeholder="输入账号" name="uname"><!--不占位-->
<br>
密码:<input type="password" placeholder="输入密码" name="pwd">
<br>
单选:
选择题<br>
<input type="radio" name="choseA" checked>A
<input type="radio" name="choseA">B
<input type="radio" name="choseA">C <br>
下拉选择:
<select>
<option>苹果</option>
<option>香脚</option>
<option>西瓜</option>
</select>
<br>
</form>

 

插入视频

<!DOCTYPE HTML>
<html>
<body> <video width=50% height=50% controls autoplay muted>
<source src=" http://vfx.mtime.cn/Video/2019/02/04/mp4/190204084208765161.mp4" alt="Second slide" style="width: 100%">
</video> </body>
</html>

 

视频链接·: http://vfx.mtime.cn/Video/2019/02/04/mp4/190204084208765161.mp

 插入音频

<audio src="FlowerFire.mp3" controls></audio>

html常用整理的更多相关文章

  1. List常用整理

            长期更新,主要记录List的各种常用操作整理. 对List进行排序 // Collections.sort(重写toString()进行排序区分) List<ObjectName ...

  2. hive sql常用整理-hive引擎设置

    遇到个情况,跑hive级联insert数据报错,可以尝试换个hive计算引擎 hive遇到FAILED: Execution Error, return code 2 from org.apache. ...

  3. 【转】数据分析sql常用整理

    [SQL 数据分析常用语句] • 1 基础查询 • 2 字符串数字日期时间 • 3 聚合数据查询 • 4 子查询 • 5 联接组合查询 • 6 高级查询 • 7 更新数据 阅读提醒:点击图片放大可看清 ...

  4. 数据分析sql常用整理

    [SQL 数据分析常用语句] 2017-07-20 00:00 数据分析 来源:datakong 转自:大数据 • 1 基础查询 • 2 字符串数字日期时间 • 3 聚合数据查询 • 4 子查询 • ...

  5. Eclipse 常用整理

    1.编译 eclipse默认是修改程序后自动编译的,如果不能自动编译,你可以查看project->build automatically选项是否被选中. 手动编译整个工程,可以使用Project ...

  6. MAC OS X 终端命令入门 (简单常用整理)

    在这里记下..防止丢失 pwd 当前工作目录 cd(不加参数) 进root cd(folder) 进入文件夹 cd .. 上级目录 cd ~ 返回root cd - 返回上一个访问的目录 rm 文件名 ...

  7. 01-artDialog4.1.7常用整理

    关闭弹出框的几种常见方法: 1,artDialog可以通过鼠标双击关闭对话框,esc关闭对话框等.为了在关闭对话框要执行某一方法,不能仅仅在弹框中的关闭按钮中写.这时提供了一个函数:close.无论在 ...

  8. <c:forEach 的常用整理

    <c:forEach items="${images}" var="img" varStatus="status"> <d ...

  9. STL常用整理

    S T L Sting: << 判断拼音序 size length 字符串长度 str[n] 代表字符串中的一个字符 可用作左值 string::size_type 用于表示字符串长度计量 ...

随机推荐

  1. The Preliminary Contest for ICPC Asia Xuzhou 2019 G Colorful String(回文自动机+dfs)

    这题建立一棵回文树,然后用dfs搜索答案,但是有一点需要注意,就是打vis的标记时,如果标记为1,那么在好几个节点都对同一个字符i打过标记,此时的搜索从字符i点回溯,回到它的父亲节点,搜索其它的字符, ...

  2. [QT] QT5.12 HTTPS请求 TLS initialization failed

    #前言 接触到了Qt的网络编程 然后尝试对一个http页面请求获取源码 是可以的 但是当对https界面发出请求的时候总是错误 TLC什么的初始化失败 百度也是没有结果 然后网上各种方法 比如说编译O ...

  3. TOPSIS算法

    title: TOPSIS算法 date: 2020-02-24 11:18:06 categories: 数学建模 tags: [评价模型, MATLAB] mathjax: true 定义 ​ C ...

  4. 初始Linux软硬链接

    转载 https://blog.csdn.net/libaineu2004/article/details/85918682 用实践让你明白"软链接"和"硬链接" ...

  5. windows centos php-beast 安装

    https://github.com/imaben/php-beast-binaries windows下 可以直接在这里下载dll 根据自己的php版本  还有是不是线程安全的 来选择下载对应的 放 ...

  6. android studio中project structure配置

    android studio project structure 1.project中填jdk路径 2.module中添androidsdk路径 3.sdks中填jdk路径

  7. 搭建第一个django项目

    django是python做web最为强大和全能的后端框架,不会django的python如一条咸鱼... 所以开始学习django框架. 首选得在python中下载django 下载命令: pip ...

  8. Vue-路由传参query与params

    注明:vue中 $router 和 $route 的区别 //$router : 是路由操作对象,只写对象 //$route : 路由信息对象,只读对象 //操作 路由跳转 this.$router. ...

  9. python学习HTML之CSS(2)

    1.边框的属性设置 PS:边框的高度和宽度可以采用百分比,但是高度方向的百分比基本无用,因为基数没定,参考没意义!! 2.内边距和外边距 3.在右下角添加一个“回顶部”的标签. <div> ...

  10. 4_5 追踪电子表格中的单元格(UVa512)(选做)

    在电子表格中的数据都存储在单元格中,它是按行和列(R)(C).一些在电子表格上的操作可以应用于单个单元格(研发),而其他的可以应用于整个行或列.典型的单元操作包括插入和删除行或列和交换单元格内容.一些 ...