右击桌面,新建一个文本文档。
打开文档,输入需要写的HTML代码,如下图所示:
<html>
<head>
<title>简单html页面</title>
</head>
<body>
<a href="url">明天,你好!</a>
</body>
</html>
点击文件中的保存文档。
选择用浏览器的方式打开文档,就可以看到我们刚刚编辑的锚点链接了。
实训写的html电商网页代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>电商</title>
<style>
*{
padding:0px;
margin:0px;
}
html,body{
width:100%;
height:100%;
overflow-y: hidden;
}
.top{
height:50px;
width:100%;
background-color:black;
}
.center{
height:15%;
width:100%;
background-image: url(img/wenzi.png);
background-repeat:repeat-y;
}
.next{
width:100%;
height:15%;
}
.bottom{
height:15%;
background-image:url(img/logo1.jpg);
background-repeat:no-repeat;
}
ul li{
display:inline-block;
height:15px;
line-height: 40px;
margin-left:20px;
}
a{
display:block;
height:40px;
color:gray;
}
</style>
</head>
<body>
<div class="top">
<ul>
<li><a><img src="img/logo1.jpg"width="100";height="50"></a></li>
<li><a>登录</a></li>
<li><a>注册</a></li>
</ul>
</div>
<div class="center">
</div>
<div class=".next">
<ul>
<li><img src="img/new.jpg" style="position:absolute; left:600px; top:250px; "/></li>
</ul>
<span><img src="img/pic1.jpg"></span>
<span><img src="img/pic2.jpg"></span>
<span><img src="img/pic3.jpg"></span>
<ul>
<li><img src="img/shizhuang.jpg" </li>
</ul>
<span><img src="img/try1.jpg" </span>
<span><img src="img/try2.jpg" </span>
<span><img src="img/try3.jpg" </span>
</div>
<div class="bottom">
<span>姓名:</span>
<input type="text" placeholder="请输入" id="username" name="username">
<span>邮箱:</span>
<input type="text" placeholder="请输入" id="username" name="username">
<br>
<span>电话:</span>
<input type="text" placeholder="请输入" id="username" name="username">
<span>qq:</span>
<input type="text" placeholder="请输入" id="username" name="username">
<span>留言</span>
<textarea rows="5" cols="50"></textarea>
<input type="submit" value="用户注册"/>
</div>
</body>
</html>