1、本地服务：下载淘宝镜像node.js ：https://npm.taobao.org/mirrors/npm ；本次下载的版本是 v10.0.0
2、下载成功后，到cmd窗口输入 node -v，返回时版本号，npm -v 返回的是版本号
3、本地安装http-server；
4、npm install -g http-server ；其中-g 是表示全局安装
5、cmd窗口输入 http-server即可
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="keywords" content="SEO搜索引擎优化,关键词,关键字">
<meta name="description" content="搜索引擎描述信息;">
<title>HTML练习演示</title>
</head>
<body>
<h2>无序列表</h2>
<ul type=circle>
<li>Huawei</li>
<li>Oppo</li>
<li>小米</li>
<li>苹果</li>
<li>默认:实芯圆点 disc</li>
<li>square：方形圆点</li>
<li>circle：空芯圆点</li>
</ul>
<h2>有序列表</h2>
<ol type="I">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ol>
<h2>自定义列表</h2>
<dl>
<dt>手机品牌</dt>
<dd>华为手机</dd>
<dd>荣耀手机</dd>
<dd>小米手机</dd>
<dd>Oppo手机</dd>
<dd>Vivo手机</dd>
<dd>苹果手机</dd>
</dl>
<h2>图片标签</h2>
<p>
<a href="javascript:void(0)"><img src="/MM.jpg" alt="甜美清纯可爱美女照片"></a>
</p>
<p>
<a href="https://www.tupianzj.com/meinv/20200519/210719.html"><img src="" alt="甜美清纯可爱美女照片"></a>
</p>
<img src="/MM.jpg" alt="甜美清纯可爱美女照片" title="美女照片">
<h2>表格标签</h2>
<table border='1'>
<tr>
<td>姓名</td>
<td>体重</td>
<td>身高</td>
</tr>
<tr>
<td>Teacher</td>
<td colspan="2">60kg/170</td>
</tr>
<tr>
<td>Tea</td>
<td rowspan="2">69kg</td>
<td>175</td>
</tr>
<tr>
<td>iris</td>
<td>80kg</td>
</tr>
</table>
<h2>表单标签</h2>
<form action="#" method="get"> <!--默认get请求，这块使用的是POST请求-->
<label for="user">账号:</label><br>
<input id="user" type="text" name="user" maxlength="10" placeholder="请输入账号"><br><br>
<label for="pwd">密码:</label><br>
<input id="pwd" type="password" name="pwd" placeholder="请输入密码"><br><br>
性别：
<!-- rodio表示单选按钮,如同时互斥的话需配置相同的name
其中checked表示默认选择
label标签：点击某文本也可联动选择某复选框，其中for里面的值一定要是id中的值
-->
<input id="man" type="radio" name="gender" value="man" checked><label for="man">男</label>
<input id="women" type="radio" name="gender" value="women"><label for="women">女</label><br><br>
爱好：
<input id="badminton" type="checkbox" name="badminton"><label for="badminton">羽毛球</label>
<input id="basketball" type="checkbox" name="basketball"><label for="basketball">篮球</label>
<input id="football" type="checkbox" name="football" checked><label for="football">足球</label>
<input id="billiards" type="checkbox" name="billiards" checked><label for="billiards">台球</label>
<input id="Glof" type="checkbox" name="Golf"><label for="Glof">高尔夫球</label><br><br>
生日：
<select name="" id="" size="3">
<option value="1990">1990</option>
<option value="1991">1991</option>
<option value="1992">1992</option>
<option value="1993">1993</option>
<!-- selected:使用的是默认下拉选择框 -->
<option selected value="1994">1994</option>
<option value="1995">1995</option>
<option value="1996">1996</option>
<option value="1997">1997</option>
<option value="1998">1998</option>
<option value="1999">1999</option>
<option value="2000">2000</option>
</select><br><br>
<select name="year" id="sel_year">
<option value="---">请选择</option>
<option value="2001">2001</option>
<option value="2002">2002</option>
<option value="2003">2003</option>
<option value="2004">2004</option>
<option value="2005">2005</option>
<option value="2006">2006</option>
<option value="2007">2007</option>
<option value="2008">2008</option>
<option value="2009">2009</option>
<option value="2010">2010</option>
</select>
<b><font>年</font></b>
<select name="month" id="sel_month">
<option value="">请选择</option>
<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option value="08">08</option>
<option value="09">09</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select>
<b><font>月</font></b>
<select name="day" id="sel_day">
<option value="---">请选择</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
<b><font>日</font><br><br></b>
<!-- 此块是使用提交按钮,不会跳转到w3school链接界面,因为是在form表单里面 -->
<!-- 表单提交: -->
<a href="https://www.w3school.com.cn/"><input type="submit" value="提交按钮"></a>
<!-- 表单重置: -->
<input type="reset" value="重置按钮">
</form>
</body>
</html>
- 前端之JavaScript基础
前端之JavaScript基础 本节内容 JS概述 JS基础语法 JS循环控制 ECMA对象 BOM对象 DOM对象 1. JS概述 1.1. javascript历史 1992年Nombas开发出C ...
- WEB前端开发CSS基础样式全面总结
Web前端开发css基础样式全面总结 颜色和单位的使用 颜色 用颜色的名字表示颜色,比如:red 用16进制表示演示 比如:#FF0000 用rgb数值表示颜色,rgb(红,绿,蓝),每个值都在0-2 ...
- 第三篇：web之前端之JavaScript基础
前端之JavaScript基础 前端之JavaScript基础 本节内容 JS概述 JS基础语法 JS循环控制 ECMA对象 BOM对象 DOM对象 1. JS概述 1.1. javascript ...
- 好程序员web前端分享HTML基础篇
好程序员web前端分享HTML基础篇,最近遇到很多新手,都会问,如果要学web前端开发,需要学什么?难不难学啊?多久能入门之类的问题?那么今天好程序员就先来给大家分享一下web前端学习路线:HTML基 ...
- 老师的blog整理 .网络编程部分 .网络编程部分 前端部分 django基础部分
老师的blog整理 .网络编程部分 .网络编程部分 前端部分 django基础部分 老师的blog整理 python基础部分: 宝哥blog: https://www.cnblogs.com/gu ...
- 前端05 /js基础
前端05 /js基础 昨日内容回顾 css选择器的优先级 行内(1000) > id(100) > 类(10) > 标签(1) > 继承(0) 颜色 rgb(255,255,2 ...
- Web前端温故知新-CSS基础
一.CSS定义与编写CSS 1.1 CSS的定义 全名:Cascading Style Sheets -> 层叠样式表 定义:CSS成为层叠样式表,它主要用于设置HTML页面中的文本内容(字体. ...
- 前端见微知著JavaScript基础篇：你所不知道的apply, call 和 bind
在我的职业生涯中,很早就已经开始使用JavaScript进行项目开发了.但是一直都是把重心放在了后端开发方面,前端方面鲜有涉及.所以造成的一个现象就是:目前的前端知识水平,应付一般的项目已然是足够的, ...
- 初学者入门web前端：C#基础知识：函数
入行前端对函数的掌握程度有可能直接影响以后工作的效率,使用函数可以高效的编写编码,节省时间,所以我整理了C#中最基础的函数知识点,虽然我在学习中 遇到很多问题,但是只要能够解决这些问题,都是好的. 一 ...
随机推荐
- Java IO学习笔记一：为什么带Buffer的比不带Buffer的快
作者:Grey 原文地址:Java IO学习笔记一:为什么带Buffer的比不带Buffer的快 Java中为什么BufferedReader,BufferedWriter要比FileReader 和 ...
- 用MAILX 发送邮件
使用 25 端口发送 mail 编辑/etc/mail.rc 文件,添加以下信息vi /etc/mail.rc set from=xxx@163.com smtp=smtp.163.comset sm ...
- 『言善信』Fiddler工具 — 16、使用Fiddler抓取移动端App请求
目录 1.抓取Android移动端App请求 2.抓取IOS移动端App请求 3.总结: 1.抓取Android移动端App请求 前提: 因为Fiddler抓包的原理就是通过代理,所以确保被测终端要和 ...
- Linux网络基础TCP/IP
1.osi:七层 上三层,主要是用户层面;下四层是实际进行数据传输物理层: 设备之间比特流的传输,物理接口,电气特性等 端口号的作用 通过IP找到服务器,通过端口号找到具体哪个服务.网页服务的端口号是 ...
- 555定时器（1）单稳态触发器电路及Multisim实例仿真
555定时器(Timer)因内部有3个5K欧姆分压电阻而得名,是一种多用途的模数混合集成电路,它能方便地组成施密特触发器.单稳态触发器与多谐振荡器,而且成本低,性能可靠,在各种领域获得了广泛的应用. ...
- 服务器硬件和RAID配置
服务器 硬件和RAID配置 目录 一.RAID 磁盘阵列介绍 1.1.RAID 0(条带化存储) 1.2.RAID 1(镜像存储) 1.3.RAID 5 1.4.RAID 6 1.5.RAID 1+0 ...
- kubeadm部署高可用版Kubernetes1.21[更新]
环境规划 主机名 IP地址 说明 k8s-master01 ~ 03 192.168.3.81 ~ 83 master节点 * 3 k8s-master-lb 192.168.3.200 keepal ...
- Kubernetes的资源管理
本节讲解为一个pod配置资源的预期使用量和最大使用量.通过设置这两组参数,可以确保pod公平地使用Kubernetes集群资源,同时也影响着整个集群pod的调度方式. 1.为pod中的容器申请资源 创 ...
- ES服务的搭建（八）
看下图的淘宝页面,可以看到搜索有多个条件及搜索产品,并且支持多种排序方式,例如按价格:其实这块有个特点,就是不管你搜索哪个商品他都是有分类的,以及他对应的品牌,这两个是固定的,但其它参数不一定所有商品 ...
- 14.4、web排错三部曲
1.在客户端上ping服务器端ip : ping 服务器ip地址 :#排除线路问题: 2.在客户端上telnet服务器端Ip 端口号: telnet 服务器ip地址 端口号:#排除防火墙的影响: 3. ...
