html基础汇总

tech2025-11-06  2

<html> <head> <title>广西土狗</title> <base></base> <link rel="stylesheet" type="text/css" href="table.css"> <meta charset="utf-8"> <script></script> <style></style> </head> <body> <h1>这是一个标题h1</h1> <hr> <h2>这是一个标题h2</h2> <hr> <h3>这是一个标题h3</h3> <p>这是一个段落。</p> <p>这是另外一个段落。</p> <a href="https://www.bupt.edu.cn">这是一个链接</a> <img src="tugou.jpg" width="120" height="100" alt="广西土狗">&nbsp;&nbsp;&nbsp; <embed height="30" width="100" src="xulie.mp3"> <br/> <b>加粗文本</b><i>斜体</i><code>电脑自动code输出</code><br>这是 <sub> 下标</sub><sup> 上标</sup> <address>地址</address> <div style="opacity:0.5;position:absolute;left:50px;width:300px;height:150px;background-color:#40B3DF"></div> <div style="font-family:verdana;padding:20px;border-radius:10px;border:10px solid #EE872A;"> <div style="opacity:0.3;position:absolute;left:120px;width:100px;height:200px;background-color:#8AC007"></div> <h3>Look! Styles and colors</h3> <div style="letter-spacing:12px;">Manipulate Text</div> <div style="color:#40B3DF;">Colors <span style="background-color:#B4009E;color:#ffffff;">Boxes</span> </div> <div style="color:#000000;">and more...</div> </div> <table border="1"> <tr> <td>row 1, cell 1</td> <td>row 1, cell 2</td> </tr> <tr> <td>row 2, cell 1</td> <td>row 2, cell 2</td> </tr> </table> <table width="100%" border="0" cellspacing="0" cellpadding="0" align="center"> <tr> <td align="center" class="biaoti" height="60">受理员业务统计表</td> </tr> <tr> <td align="right" height="25">2017-01-02---2017-05-02</td> </tr> </table> <table width="100%" border="0" cellspacing="1" cellpadding="4" bgcolor="#cccccc" class="tabtop13" align="center"> <tr> <td colspan="2" class="btbg font-center titfont" rowspan="2">受理员</td> <td width="10%" class="btbg font-center titfont" rowspan="2">受理数</td> <td width="10%" class="btbg font-center titfont" rowspan="2">自办数</td> <td width="10%" class="btbg font-center titfont" rowspan="2">直接解答</td> <td colspan="2" class="btbg font-center titfont">拟办意见</td> <td colspan="2" class="btbg font-center titfont">返回修改</td> <td colspan="3" class="btbg font-center titfont">工单类型</td> </tr> <tr> <td width="8%" class="btbg font-center">同意</td> <td width="8%" class="btbg font-center">比例</td> <td width="8%" class="btbg font-center">数量</td> <td width="8%" class="btbg font-center">比例</td> <td width="8%" class="btbg font-center">建议件</td> <td width="8%" class="btbg font-center">诉求件</td> <td width="8%" class="btbg font-center">咨询件</td> </tr> <tr> <td width="7%" rowspan="8" class="btbg1 font-center">受理处</td> <td width="7%" class="btbg2">王艳</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td class="btbg2">&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td class="btbg2">&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td class="btbg2">&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td class="btbg2">&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td class="btbg2">&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td class="btbg2">&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td class="btbg2 font-center">总计</td> <td class="btbg2 font-center">20</td> <td class="btbg2 font-center">20</td> <td class="btbg2 font-center">20</td> <td class="btbg2 font-center">20</td> <td class="btbg2 font-center">20</td> <td class="btbg2 font-center">20</td> <td class="btbg2 font-center">20</td> <td class="btbg2 font-center">20</td> <td class="btbg2 font-center">20</td> <td class="btbg2 font-center">20</td> </tr> <tr> <td width="7%" rowspan="8" class="btbg1 font-center">话务组</td> <td width="7%" class="btbg2">王艳</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td class="btbg2">王艳</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td class="btbg2">王艳</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td class="btbg2">王艳</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td class="btbg2">&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td class="btbg2">&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td class="btbg2">&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> <td>&nbsp;</td> </tr> <tr> <td class="btbg2 font-center">总计</td> <td class="btbg2 font-center">20</td> <td class="btbg2 font-center">20</td> <td class="btbg2 font-center">20</td> <td class="btbg2 font-center">20</td> <td class="btbg2 font-center">20</td> <td class="btbg2 font-center">20</td> <td class="btbg2 font-center">20</td> <td class="btbg2 font-center">20</td> <td class="btbg2 font-center">20</td> <td class="btbg2 font-center">20</td> </tr> </table> <div id="container" style="width:500px"> <div id="header" style="background-color:#FFA500;"> <h1 style="margin-bottom:0;">主要的网页标题</h1></div> <div id="menu" style="background-color:#FFD700;height:200px;width:100px;float:left;"> <b>菜单</b><br> HTML<br> CSS<br> JavaScript</div> <div id="content" style="background-color:#EEEEEE;height:200px;width:400px;float:left;"> 内容在这里</div> <div id="footer" style="background-color:#FFA500;clear:both;text-align:center;"> 版权 © runoob.com</div> </div> <h4>无序列表:</h4> <ul> <li>Coffee</li> <li>Tea</li> <li>Milk</li> </ul> <ol> <li>Coffee</li> <li>Tea</li> <li>Milk</li> </ol> <ol start="50"> <li>Coffee</li> <li>Tea</li> <li>Milk</li> </ol> <p>我的母亲有 <span style="color:blue;font-weight:bold">蓝色</span> 的眼睛,我的父亲有 <span style="color:darkolivegreen;font-weight:bold">碧绿色</span> 的眼睛。</p> <form> First name: <input type="text" name="firstname"><br> Last name: <input type="text" name="lastname"> </form> <form> Password: <input type="password" name="pwd"> </form> <form> <input type="radio" name="sex" value="male">Male<br> <input type="radio" name="sex" value="female">Female </form> <form> <input type="checkbox" name="vehicle" value="Bike">I have a bike<br> <input type="checkbox" name="vehicle" value="Car">I have a car </form> <form name="input" action="html_form_action.php" method="get"> Username: <input type="text" name="user"> <input type="submit" value="Submit"> </form> <form action=""> <select name="cars"> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="fiat">Fiat</option> <option value="audi">Audi</option> </select> </form> <form action=""> <input type="button" value="Hello world!"> </form> <form action=""> <select name="cars"> <option value="volvo">Volvo</option> <option value="saab">Saab</option> <option value="fiat" selected>Fiat</option> <option value="audi">Audi</option> </select> </form> <textarea rows="10" cols="30"> 我是一个文本框。 </textarea> <form action=""> <fieldset> <legend>Personal information:</legend> Name: <input type="text" size="30"><br> E-mail: <input type="text" size="30"><br> Date of birth: <input type="text" size="10"> </fieldset> </form> <iframe src="demo_iframe.htm" width="200" height="200"></iframe> <iframe src="demo_iframe.htm" frameborder="0"></iframe> <iframe src="demo_iframe.htm" name="iframe_a"></iframe> <p><a href="http://www.runoob.com" target="iframe_a">RUNOOB.COM</a></p> <p style="background-color:#FF00FF"> 通过十六进制设置背景颜色 </p> <p style="background-color:rgb(255,255,0)"> 通过 rbg 值设置背景颜色 </p> <p style="background-color:yellow"> 通过颜色名设置背景颜色 </p> <script> document.write("Hello World!"); </script> <script> document.write("Hello World!") </script> <noscript>抱歉,你的浏览器不支持 JavaScript!</noscript> <h1>我的第一段 JavaScript</h1> <p id="demo"> JavaScript 能改变 HTML 元素的样式。 </p> <script> function myFunction() { x=document.getElementById("demo") // 找到元素 x.style.color="#ff0000"; // 改变样式 } </script> <button type="button" onclick="myFunction()">点击这里</button> </body> </html>

最新回复(0)