php课程的第三天
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了php课程的第三天相关的知识，希望对你有一定的参考价值。
今天是学习php课程的第三天，今天主要是学习列表有关的知识。
首先是定义。有序列表ol，无序列表ul。有序列表会出现如1. 2.之类的标题，无序列表则不会。
下面用代码来表示。
<html>
<head>
<title></title>
</head>
<body>
<ul>
<li>滚动</li>
<li>直播</li>
</ul>
<ol>
<li>调查</li>
<li>排行</li>
<li>国际</li>
</ol>
</body>
</html>
然后我们可以给他加些效果，做成一个横着的小标签栏。其中会用到颜色格式等指令。
代码如下。
<html>
<head>
<title></title>
<style>
li{
float: left;list-style: none;background-color: red;font-
size:50px;margin: 2px;height: 50px;line-height: 50px
}
ul{
margin: 0 auto;text-align: center;
}
</style>
</head>
<body>
<ul>
<li>滚动</li>
<li>直播</li>
<li>调查</li>
<li>排行</li>
<li>国际</li>
</ul>
</body>
</html>
这样就会出来一个小的红色导航栏。接下来我们做一个完整的导航栏。
代码如下。
<html>
<head>
<title></title>
<style>
div{height: 50px;width: 100%;background-color: blue;
}
li{
float: left;list-style: none;margin: 2px;height: 50px;line-
height: 50px;
text-align: center;
}
ul{background-color: blue;
margin: 0 auto;text-align: center;height: 50px;width: 800px;
}
li:hover{
background-color: green;
}
</style>
</head>
<body>
<div>
<ul>
<li>滚动</li>
<li>直播</li>
<li>调查</li>
<li>排行</li>
<li>国际</li>
</ul>
</div>
</body>
</html>
这就是我今天所学的内容，继续加油!
以上是关于php课程的第三天的主要内容，如果未能解决你的问题，请参考以下文章