自行练习的html
记录一下,使用hbuilder,自动提示代码,写的会非常快,但是很多新的标签,如标签等不会提示,但可以写,一样会显示效果
new_file.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="ytf-8">
<meta name="keywords" content="java it" />
<meta name="description" content="this is a java test" />
<meta name="author" content="lh" />
<!-- <meta http-equiv="refresh" contenc="2;ur1=http://www.baidu.com"> -->
<title>test</title>
<style type="text/css">
body {
color: chocolate;
}
</style>
<!-- <link rel="stylesheet" type="text/css" href="D:\Java workspace\MonkeyShop\WebContent\css\login.css"/> -->
<!-- <script type="text/javascript">
alert("asdasdasda");
</script> -->
<!-- <base href="D:\Java workspace\MonkeyShop\WebContent\css" target="" /> -->
</head>
<body bgcolor="aliceblue" text="red">
<a href="maito:2928446205@qq.com">contact us</a>
<a href="https://www.baidu.com">baidu</a>
<!-- <a href="www.baidu.com" target="_blank">baidu</a>
<a href="www.baidu.com" target="blank">baidu</a> -->
<ol>
<li><a href="#first">jianjie</a></li>
<li><a href="#second">content</a></li>
</ol>
<i>asdas</i>
<em>
ssdfsdfsdf
<input type="password" name="asd" />
</em>
welcome to <adddress>中欧班列</adddress>
<b>qwe</b>
<strong>wsadfdsf</strong>
<del>asdas</del>
<ins>asdasd</ins>
<sub>asdasd</sub>
<sup>asdas</sup>
<bdo dir="rt1">qwe阿斯蒂芬撒地方士大夫qw</bdo>
<abbr title="Hyper Text Language">HTML</abbr>
<span title="hdasd">dasd</span>
<small>daasd</small>
<big>asdasd</big>
<h2>
<form action="" method="get" enctype="application/x-www-form-urlencoded">
用户名:<input type="text" name="usr_name" id="" value="erha" />
<br>
密码:<input type="text" name="usr_password" id="" value="" size="20" maxlength="6" />
<br>
年龄:<input type="text" name="age" id="" value="" />
<hr>
asdasd
<br>
<input type="submit" name="" id="" value="" />
</form>
<span>dasdas</span>
<!-- wweqr qweqwe -->
"
Ι
<
>
×
®
&
<p>https://www.runoob.com/html/html-tutorial.html</p>
</h2>
<pre>
qweqweqweqweqw
</pre>
<div id="" style="width:auto; height: 6.25rem;background-color: antiquewhite;">
导航部分
</div>
<div id="" style="width:25rem;height: 6.25rem;background-color: antiquewhite;">
正文部分
</div>
<hr>
zhiyao 9998 <span style="font-size: initial;color: cadetblue;">998</span>
<h3>xiaosi</h3>
<ol type="3">
<li>chiji</li>
<li>wanzhe</li>
</ol>
<h3>asd</h3>
<ul type="disc">
<li>asd</li>
<li>asdasd</li>
</ul>
<ol>
<p><a href="first">jianjie</a></p>
<p>this is first</p>
<p><a href="second">dier</a></p>
<p>second</p>
</ol>
<h3>qs</h3>
<dl>
<dt>lol</dt>
<dd>它是腾讯公司代理的一款网络游戏,中文名称叫英雄联盟</dd>
<dd>可以分为pc端和移动端</dd>
<dt>html</dt>
<dd>是一种用来制作网页额标记语言</dd>
<dt>java</dt>
<dd>是一种跨平台的编程语言</dd>
</dl>
<hr color="aliceblue">
<hr size="7" color="aqua">
<hr color="antiquewhite" width="400px">
<div id="" style="width:37.5rem;height:3.125rem;background-color:aquamarine;">
<hr color="red" width="300px" align="right">
</div>
<div id="" unselectable="on">
<img src="C:\Users\29284\Desktop\nk650.png" alt="tupian jia zai shi bai" title="chunfengmotuo">
<img src="C:\Users\29284\Desktop\nk650.pn" alt="shi bai">
</div>
<!-- <div style="width: 80px;height: 80px;background: red;">
<img src="C:\Users\29284\Desktop\nk650.png" width="auto" height="auto">
</div> -->
<div id="first">
asdasdasdas
</div>
<a href="" name="second"></a>
<p>second</p>
</body>
</html>
new_file2.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>document</title>
</head>
<body>
<ol>
<li><a href="new_file.html">new_file.html</a></li>
<li><a href="new_file.html#first">this is first</a></li>
</ol>
<table border="1" width="400px" height="200px" align="center" bordercolor="red" bgcolor="#cccccc"
background="C:\Users\29284\Desktop\nk650.png" cellspacing="0" cellpadding="20px">
<tr align="right" valign="top">
<th>Header</th>
<th>asdas</th>
<th>'dasdasda'</th>
</tr>
<tr align="center" valign="middle" bgcolor="aqua">
<td>Data</td>
<td valign="bottom" bgcolor="aquamarine">hello</td>
<td>hellp</td>
</tr>
<tr valign="bottom">
<td>hrrr</td>
<td>asd</td>
<td>asdasdasda</td>
</tr>
</table>
<table border="1" width="500px" height="300px" cellspacing="" cellpadding="">
<tr>
<td colspan="4" align="center">hello</td>
</tr>
<tr>
<td>Data</td>
<td>hello</td>
<td>jeee</td>
<td>asdaas</td>
</tr>
<tr>
<td rowspan="2" colspan="3">asdaasd</td>
<td>heelo</td>
</tr>
<tr>
<td>sdfssdf</td>
</tr>
</table>
<table border="5" width="600" height="300px" align="center" cellpadding="">
<caption>
<h2>students base information</h2>
</caption>
<thead bgcolor="aquamarine">
<th>id</th>
<th>name</th>
<th>age</th>
<th>sex</th>
</thead>
<tbody bgcolor="bisque">
<tr>
<td>13</td>
<td>rtr</td>
<td>43</td>
<td>woman</td>
</tr>
<tr>
<td>13</td>
<td>rtr</td>
<td>43</td>
<td>woman</td>
</tr>
<tr>
<th>12</th>
<th>qwe</th>
<th>12</th>
<th>man</th>
</tr>
</tbody>
<tfoot bgcolor="brown" align="center">
<tr>
<td width="25%">zongji renshu </td>
<td colspan="1"></td>
</tr>
</tfoot>
</table>
<h1 align="center">yonghu zhuce</h1>
<form action="" method="post">
yonghuming:<input type="text" name="usrname" id="name" value="erhga" />
<br>
mima:<input type="text" name="usrpassword" id="password" value="123456" size="20" maxlength="6" />
<br>
age:<input type="text" name="usrage" id="age" value="18" />
<br>
sex:
<input type="radio" name="usrsex" id="sex" value="male" />
<input type="radio" name="usrsex" id="sex" value="female" />
<br>
aihao:
<input type="checkbox" name="hobby" id="hobby1" value="eat" />chifan
<input type="checkbox" name="hobby" id="hobby2" value="sleep" />shuijiao
<input type="checkbox" name="hobby" id="hobby3" value="doudou" />dadoudou
<br>
touxiang:
<input type="file" name="usrhead" accept="image/gif" accept="image/jpeg" accept="image/x-png" id="head"
value="" />
<input type="hidden" name="userid" id="" value="1234" />
<br>
<input type="submit" value="tijiao" />
<input type="reset" name="" id="" value="chonzhi" />
<br>
<input type="datetime" name="" id="" value="123" />
<input type="email" name="" id="" value="email" />
<!-- <input type="image" name="" id="" value="image" /> -->
</form>
<h1 align="center">
xuele xuanzhe
</h1>
<form action="" method="get">
xueli:
<select name="degree">
<optgroup>
<option value="0">xuanzhe xueli</option>
<option value="dazhuan ">dazhuan</option>
<option value="gaozhong">gaozhong</option>
<option value="daxue" selected="selected">daxue</option>
</optgroup>
</select>
<br>
city:
<select name="city">
<optgroup label="sahnxi province">
<option value="taiyuan">taiyuan</option>
<option value="datong">datong</option>
<option value="chanzhi">chanzhi</option>
</optgroup>
<optgroup label="sichuang province">
<option value="cdu">cdu</option>
<option value="nanc">nanc</option>
<option value="leshang">leshang</option>
</optgroup>
</select>
<hr>
gerenjianjie:
<textarea rows="" cols="" name="intrduce"></textarea>
<hr>
fuwuxieyi:
<textarea rows="10" cols="20" name="introduce" readonly="">
请遵守本网站的相关协议和国家的法律规定
请遵守本网站的相关协议和国家的法律规定
请遵守本网站的相关协议和国家的法律规定
请遵守本网站的相关协议和国家的法律规定
请遵守本网站的相关协议和国家的法律规定
</textarea>
<hr>
<input type="submit" value="tijiao" />
</form>
<fieldset id="">
<legend>individual information</legend>
<label for="name">yonghuming:</label>
<input type="text" name="name" id="" value="input usr name" />
<br>
<label for="email">email:</label>
<input type="email" name="" id=" " value="" />
</fieldset>
<input type="button" name="" id="" value="anniu" />
<button type="button"><img width="20" height="20" src="C:\Users\29284\Desktop\nk650.png"></button>
<fieldset id="">
<legend>xueyuan:</legend>
number:<input type="text" name="" id="" value="" />
<br>
profession:<input type="text" name="" id="" value="" />
<br>
university:<input type="text" name="" id="" value="" />
</fieldset>
<iframe src="new_file.html" width="200" height="200" frameborder="1" scrolling="yes">
<h2>zhuti</h2>
<hr>
<a href="new_file.html" target="_top">new file first</a>
<!-- <a href="new_file.html#second" target="_top">new file <second></second></a> -->
</iframe>
<iframe src="new_file2.html" width="600" height="600" frameborder="1" name="hello"></iframe>
</body>
</html>
new_file3.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>file3</title>
</head>
<body>
<articel>
<header>标题</header>
<section>
第一段
</section>
<section>
第二段
</section>
<footer>脚注</footer>
</articel>
<aside>广告</aside>
<br>
<figure>
<figcaption>log标题</figcaption>
<img src="../../image/google.png" alt="">
<img src="../../image/facebook.png" alt="">
</figure>
<nav>
<ul>
<li><a href="new_file.html">file1</a></li>
<li><a href="new_file2.html">file2</a></li>
<li>视频</li>
<li>图片</li>
<li>知道</li>
<li>文库</li>
<li>贴吧</li>
</ul>
</nav>
welcome <mark>to asd </mark> html!
<form action="" autocomplete="on" method="post" id="myform">
<label for="email">youxiang:</label>
<input type="text" name="email" id="email" value="email" />
<br>
<label for="home">gerenzhuye</label>
<input type="url" name="home" id="home" value="home" />
<br>
<label for="dianhua">dianhua:</label>
<input type="tel" name="phone" id="phone" />
<br>
<label for="keyword">关键字</label>
<input type="search" name="keyword" id="keyword">
<br>
<label for="num">数字</label>
<input type="number" name="num" id="num" min="1" max="10" step="2">
<br>
<label for="birthday">出生日期:</label>
<input type="month" name="birthday" id="birthday">
<br>
<label for="color">颜色:</label>
<input type="color" name="color" id="color">
<br>
<label for="usrname">用户名:</label>
<input type="text" name="name" id="usrname" placeholder="请输入用户名" required="" autocomplete="off">
<br>
<label for="age">年龄:</label>
<input type="text" name="age" id="age" pattern="\d{1,2}">
<!-- 年龄只能是两位 -->
<br>
<label for="city">chengshi</label>
<input type="text" name="city" id="city" value="" list="citylist" />
<br>
<datalist id="citylist">
<option value="beijing">北京</option>
<option value="nanjing">南京</option>
<option value="shanghai">上海</option>
<option value="tianjin">天津</option>
</datalist>
<input type="submit" value="myform" />
</form>
<audio controls>
<source src="../../audio/earth.ogg">
<source src="../../audio/water.mp3">
您的浏览器不支持audio标签,请更换浏览器
</audio>
<hr>
<video src="C:\Users\29284\Documents\oCam\录制_2021_12_21_00_14_14_820.mp4" controls width="600px"
poster="C:\Users\29284\Desktop\nk650.png"></video>
</body>
</html>