HTML设计⼀个图书管理⽹页
HTML设计简单⽹页
ps：代码运⾏时图⽚不能显⽰，您需将 background: url(aaa/zcx.jpg)~<body background=“aaa/timg.jpg”~<img src=“aaa/010.jpg” ~中的aaa/xx.jpg，换成你的图⽚，
解决：
（1）可以新建⽬录，然后把照⽚放⼊⽬录中，就可以改为⽬录名/图⽚名，
（2）或者直接与该html⽂件粘贴在同个⽬录下（不推荐，图⽚多的话瞅着乱不规整）
该代码图⽚可设为学校校徽或公司logo <img src=“aaa/010.jpg”
缺点：logo有⽩边最好⽤ps整完直接引⼊背景图⽚（然后就可以把<img~删了，记得把style中的img{}也删了）
<!DOCTYPE html>
git常用命令及方法大全<html lang="en">
windows2008安装教程<head>
<meta charset="UTF-8">
<title>CSDN</title>
<style>
span{
font-family:"楷体";
font-size:70px;
text-align:center;
color:red;
}
body {
font-family: "楷体";
margin: 0px;
padding: 0px;
}
div{
float:left;
margin-left: 70px;
}
img{
position:absolute;
left:1100px;
top:30px;
}
#nnn{
font-size:25px;
}
#shuosuo{
width:50px;
height:40px;
}
a{
text-decoration:none;property brothers home
}
a:hover{
color:red ;
text-decoration: none;
}
nav{
font-size:20px;
float:initial;
margin: 0 0 0 0;
padding: 0 0 0 0 ;
}
nav ul li {
学生个人网页html代码float:left;
display: inline;
}
nav ul li a {
float: left;
padding: 11px 20px;
静态方法可作用于类变量和实例变量font-size: 14px;
text-align: center;
text-decoration: none;
background: url(aaa/zcx.jpg)
center left no-repeat;
color: #fff;
outline: none;
}
</style>
</head>
<h1><span> XXX图书管理系统</span></h1>
<p><nav>
<ul>
<li><a href="#" title="个⼈信息" target="_blank">个⼈信息</a></li>
<li><a href="#" title="图书借阅" target="_blank">图书借阅</a></li>
<li><a href="#" title="图书退还" target="_blank">图书退还</a></li>
<li><a href="#" title="图书信息管理" target="_blank">图书信息管理</a></li>
<li><a href="#" title="新书⼊馆" target="_blank">新书⼊馆</a></li>
<li><a href="#" title="" target="_blank"></a></li>
</ul>
</nav>
</p>
<p><h2>
<input id="nnn" type="search" name="shousuo" placeholder="图书搜索"/>
<button id="shuosuo" type="button" name="queding" onclick="window.location.href='www.baidu'" >搜索</button> </h2></p>
<body>
<body background="aaa/timg.jpg"
>
</body>
</br>
<img src="aaa/010.jpg" width="200" height="200" />
<div><h1><a href="ccc.html" target="_blank">科技类</a></h1>
<ul>
<li><a href="ccc.html">《最新科学技术全书》</a></li>
<li><a href="ccc.html">《科学技术发展简史》</a></li>
<li><a href="ccc.html">《科学探索者》</a></li>
<li><a href="ccc.html">《时间简史》</a></li>
<li><a href="ccc.html">......</a></li>
</ul>
<h1><a href="ccc.html">⽂学类</a></h1>
<ul>
<li><a href="ccc.html">《麦⽥⾥的守望者》</a></li>
<li><a href="ccc.html">《⽺脂球》</a></li>
<li><a href="ccc.html">《到灯塔去》</a></li>
<li><a href="ccc.html">《诗经》</a></li>
<li><a href="ccc.html">......</a></li>
foreign用法
</ul>
</div>
<div><h1><a href="ccc.html">艺术类</a></h1>
<ul>
<li><a href="ccc.html">《艺术的故事》 </a></li>
<li><a href="ccc.html">《美的历程》</a></li>
<li><a href="ccc.html">《西⽅美学史》</a></li>
<li><a href="ccc.html">《艺术发展史》</a></li>
<li><a href="ccc.html">......</a></li>
</ul>
<h1><a href="ccc.html">医学类</a></h1>
<ul>
<li><a href="ccc.html">《⽣命科学史》</a></li>
<li><a href="ccc.html">《⽣命科学史》</a></li> <li><a href="ccc.html">《医学⽅法论》</a></li> <li><a href="ccc.html">《医学的历史》</a></li> <li><a href="ccc.html">《本草纲⽬》</a></li>
<li><a href="ccc.html">......</a></li>
</ul>
</div>
<div>
<h1><a href="ccc.html">哲学类</a></h1>
<ul>
<li><a href="ccc.html">《哲学的故事》</a></li>
<li><a href="ccc.html">《哲学与⼈⽣》</a></li>
<li><a href="ccc.html">《⼤问题》</a></li>
<li><a href="ccc.html">《西⽅哲学史》</a></li>
<li><a href="ccc.html">......</a></li>
</ul>
<h1><a href="ccc.html">经济类</a></h1>
<ul>
<li><a href="ccc.html">《经济学原理》</a></li> <li><a href="ccc.html">《统计学原理》</a></li> <li><a href="ccc.html">《微观经济学》</a></li> <li><a href="ccc.html">《宏观经济学》</a></li> <li><a href="ccc.html">......</a></li>
</ul>
</div>
<div><h1><a href="ccc.html">计算机类</a></h1>
<ul>
<li><a href="ccc.html">《代码⼤全》</a></li>
<li><a href="ccc.html">《程序眼修炼之道》</a></li> <li><a href="ccc.html">《c程序设计语⾔》</a></li> <li><a href="ccc.html">《算法导论》</a></li>
<li><a href="ccc.html">......</a></li>
</ul>
<h1><a href="ccc.html">⼈⽂类</a></h1>
<ul>
<li><a href="ccc.html">《陈序经》</a></li>
<li><a href="ccc.html">《波风与波⾕》</a></li> <li><a href="ccc.html">《伟⼤的海》</a></li>
<li><a href="ccc.html">《幻境中相逢》</a></li> <li><a href="ccc.html">......</a></li>
</ul>
</div>
</body>
</html>
效果如下：
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。
发表评论