收藏 分销(赏)

html基本标签应用.doc

上传人:仙人****88 文档编号:12004789 上传时间:2025-08-26 格式:DOC 页数:12 大小:291.54KB 下载积分:10 金币
下载 相关 举报
html基本标签应用.doc_第1页
第1页 / 共12页
html基本标签应用.doc_第2页
第2页 / 共12页


点击查看更多>>
资源描述
<html> <head> <title>常用于布局的块级标签</title> </head> <body> <h1>商品信息</h1> <h2>产品类别</h2> <hr/> <ul> <li>数码</li> <ul> <li>笔记本</li> <li>手机</li> <li>家电</li> </ul> <li>美容</li> <li>服装</li> </ul> <hr/> 联想电脑 <dl> <dd>商品型号:联想IdeaPad Y450A-TFU(NBA纪念版)</dd> <dd>价格:4999元</dd> <dd>所在地:北京</dd> </dl> <hr/> <h2>购物流程</h2> <ol> <li>确认购买信息</li> <li>付款到贵美</li> <li>确认收货</li> <li>付款给商家</li> <li>双方评价</li> </ol> </body> </html> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <title>img和span标签练习</title> </head> <body> <h1>促销信息</h1> <dl> <dt><img src="computer.jpg" alt="Acer上网本,特惠拍卖"title="Acer上网本,特惠拍卖"/><dt> <dd>拍卖Acer上网本</dd> <dd>奔腾双核,1G内存,200G硬盘</dd> <dd>跳楼疯抢价<span style="color:red;font-size:70px;">1</span>元起</dd> </body> </html> <html> <head> <title>唐诗三百首</title> </head> <body> <h1>唐诗三百首</h1> <hr/> <h2>目录</h2> <p>第一首:静夜思</p> <p>第二首:忆江南</p> <p>第三首:长恨歌</p> <hr/> <h3>静夜思</h3> <p>作者:李白</p> <p>床前明月光,疑是地上霜。举头望明月,低头思故乡。</p> <hr/> <h3>【李白简介】</h3> <p>李白,字太白</p> </body> </html> <html> <head> <title>贵美商城</title> </head> <body> <div style="text-align: left"><img src="logo.jpg"/></div><div style="text-align: right"><a href="denglu.html">登录</a>|关于贵美|贵美助理|<a href="mailto:guimeiWebMater@">联系我们</a></div> <hr/> <div style="text-align: left">手机&nbsp;-&nbsp;诺基亚&nbsp;-&nbsp;<a href="#moto">MOTO</a>&nbsp;-&nbsp;索爱</div> <h1>导购资讯</h1> <div style="text-align: left"> <p> 参观电玩达人的宝贝仓库<br/> 炎炎夏日,冰凉家具两折起<br/> 周末折扣,品牌三折热卖<br/> </p> </div> <hr/> <h4>网游专区</h4> <ol> <li>QQ幻想100点卡只需¥8.8元</li> <li>热血江湖250点只需¥8.8元</li> <li>问道30元卡只需¥25.0元</li> <li>跑跑点卡200点只需¥16.8元</li> </ol> <h4>数码产品</h4> <ul> <li>最酷音乐手机导购</li> <li>最强街机6300仅售1450</li> <li>99元热销学生Mp3推荐</li> <li>漫步者音箱76元搞定</li> </ul> <hr/> <h4><a name="moto">MOTO&nbsp;E2&nbsp;音乐手机</a></h4> <dl> <dd>130W像素摄像头 Linux智能系统</dd> <dd>Intel XScale 处理器</dd> <dd>A2DP蓝牙立体声 市场价:1690</dd> <dd>开学价:1045</dd> </dl> <hr/> 版权信息:&nbsp;Copyright&nbsp;&copy;&nbsp;1998 - 2007&nbsp;GuiMei&nbsp;Shopping&nbsp;Inc.All&nbsp;Rights&nbsp;Reserved </body> </html> <html> <head> <title> 网站登录 </title> </head> <body> <h2>贵美网站会员登录</h2> <form action="login.jsp"method="post"> <p>贵美网站邮箱:<input name="guimeimail" type="text" size="30" maxlength="30" /></p> <p>&nbsp输&nbsp入&nbsp密&nbsp码:<input name="mima" type="text" size="30" maxlength="30" /></p> <p>再次输入密码:<input name="mima2" type="text" size="30" maxlength="30" /></p> <p> <input name="type" type="radio" value="豪华版" checked="checked">豪华版 <input name="type" type="radio" value="简洁版" >简洁版 </p> <p> <input type="checkbox" name="hobby1"/>自动登录 <input type="checkbox" name="hobby2"/>安全登录 </p> <p> <input type="reset" name="reset" value="重置"/> <input type="submit" name="reset" value="登录"/> </p> <p> <input name="tupian" type="image" src="reg.gif"/> </p> <hr/> <a href="guimei.html">返回首页</a> </form> </body> </html> <html> <head> <title>表单小结</title> <script language="javascript"> function agree() { if(document.getElementById('cb').checked) document.getElementById('tj').disabled=false; else document.getElementById('tj').disabled='disabled'; } </script> </head> <body> <h3>申请表</h3> <form action="login.jsp"method="post"> 姓名:<input name="name" type="text" size="30" maxlength="30" /><br/> 密码:<input name="mima" type="text" size="30" maxlength="30" /><br/> 照片:<input name="file" type="file"/><br/> 感兴趣的职位: <input name="type" type="radio" value="Web设计" checked="checked"/>Web设计 <input name="type" type="radio" value="Web开发"/>Web开发<br/> 向往城市: <select name="city"> <option value="" selected="selected">[请选择]</option> <option value="0">包头</option> <option value="1">北京</option> <option value="2">上海</option> <option value="3">深圳</option> </select><br/> 协议:<br/> <textarea name="textarea" cols="40" rows="6" readonly="readonly"> 求职信息必须真实、准确,本网站只负责向企业推荐。 </textarea><br/> <input type="checkbox" name="hobby" onclick="agree();" id="cb"/>我认真阅读并接受以上协议。<br/> 经验: <select name="jingy"> <option value="0" selected="selected">无经验</option> <option value="1">有经验</option> <select/><br/> <input name="btn" type="submit" value="提交" disabled="disabled" id="tj"/> &nbsp;&nbsp; <input type="reset" name="reset" value="重置"/> </form> </body> </html> <html> <head> <title>贵美商城</title> <style type="text/css"> .one { width:200px; background:url(images/bg.gif) no-repeat; } li { width:47px; font:12px ; list-style:none; float:left; line-height:30px; } .title { font: 14px 宋体; letter-spacing:5px; white-space:nowrap; text-decoration:underline; } .orange { width:80px; line-height:12px; font:bold 14px; color:#ff7300; float:none; } .txt { line-height:18px; list-style:none; float:none; } </style> </head> <body> <div class="title">您好,欢迎访问贵美商城</div> <br/> <div class="one"> <ul > <li class="txt"></li> </ul> <ul> <li class="orange">家用电器</li> <li>大家电</li> <li>洗衣机</li> <li>电冰箱</li> <li>相机</li> <li>电视</li> <li>DVD</li> <li>相机</li> <li>电视</li> <li>DVD</li> </ul> <ul> </ul> <ul> <li class="orange">日用百货</li> <li>肥皂</li> <li>洗衣粉</li> <li>纸巾</li> <li>洗发水</li> <li>洗洁精</li> <li>毛巾</li> <li>相机</li> <li>电视</li> <li>DVD</li> <li></li> </ul> </div> </body> </html> <html> <head> <title>贵美商城主导航条</title> <style type="text/css"> .menu { text-align:center; background:url(images/h_bg.jpg) no-repeat; background-position:20px -92px; height:100%; } </style> <link rel="stylesheet" href="css/css.css" type="text/css"/> </head> <body> <div class="menu"> <ul> <li><a href="#">首页</a></li> <li><a href="#">家用电器</a></li> <li><a href="#">手机数码</a></li> <li><a href="#">日用百货</a></li> <li><a href="#">书籍</a></li> <li><a href="#">帮助中心</a></li> <li><a href="#">免费开店</a></li> <li><a href="#">全球咨询</a></li> </ul> </div> </body> </html> <html> <head> <title>贵美顶部菜单</title> <style type="text/css"> div { margin:20px; } .pic { margin-right:5px; text-align:center; float:right; font:14px; height:26px; line-height:26px; } a { color:black; text-decoration:none; } .pic1{width:28px;height:26px;background:url(images/icon.gif) no-repeat -5px -0px;} .pic2{width:22px;height:26px;background:url(images/icon.gif) no-repeat -32px -0px;} .pic3{width:28px;height:26px;background:url(images/icon.gif) no-repeat -84px -0px;} .pic4{width:28px;height:26px;background:url(images/icon.gif) no-repeat -110px -0px;} .pic5{width:45px;height:24px;background:url(images/icon.gif) no-repeat -2px -28px;} </style> </head> <body> <div> <ul> <li class="pic pic5"><a href="#">注册</a></li> <li class="pic pic5"><a href="#">登陆</a></li> <li class="pic"><a href="#">设为首页</a></li> <li class="pic pic4">&nbsp</li> <li class="pic"><a href="#">加入收藏</a></li> <li class="pic pic3">&nbsp</li> <li class="pic"><a href="#">帮助中心</a></li> <li class="pic pic2">&nbsp</li> <li class="pic"><a href="#">购物车</a></li> <li class="pic pic1">&nbsp</li> </ul> </div> </body> </html>
展开阅读全文

开通  VIP会员、SVIP会员  优惠大
下载10份以上建议开通VIP会员
下载20份以上建议开通SVIP会员


开通VIP      成为共赢上传

当前位置:首页 > 包罗万象 > 大杂烩

移动网页_全站_页脚广告1

关于我们      便捷服务       自信AI       AI导航        抽奖活动

©2010-2025 宁波自信网络信息技术有限公司  版权所有

客服电话:0574-28810668  投诉电话:18658249818

gongan.png浙公网安备33021202000488号   

icp.png浙ICP备2021020529号-1  |  浙B2-20240490  

关注我们 :微信公众号    抖音    微博    LOFTER 

客服