博客列表 >ul定义列表的使用,列表样式的控制使用;2018年8月14日作业

ul定义列表的使用,列表样式的控制使用;2018年8月14日作业

小程序开发·网站建设·系统开发的博客
小程序开发·网站建设·系统开发的博客原创
2018年08月15日 03:02:16678浏览

一、学习php为什么要掌握html?

答:php是用来写后端框架的语言,html是前端标记语言,通过php后端的程序来控制前端的html,以失效我们所要的效果和功能。两者是互相关联起作用的,所以必须要掌握html,才能认识html语言所要表达的信息是什么。

二、为什么选择PHP开发动态网站?

答:1、php语言是目前最流行的框架开发语言;

2、用php语言开发项目要比用其他语言开发的效率会高很多;

3、php语言有完善的功能和框架。


三、表格作业代码

通过以下代码可以实现表格创建,表格边框设置,表格表头设置,表格行内属性设置,鼠标移入行内的效果设置,简单的按钮样式制作。

实例

<!DOCTYPE html>
<html>
<head>
	<title>8月14日作业</title>
	<meta charset="utf-8">
</head>
<body>
    <table>
        <caption>采购清单</caption>
        <tr>
            <th>编号</th>
            <th>产品名称</th>
            <th>产品价格</th>
            <th>采购数量</th>
            <th>产品图片</th>
            <th>立即shopping</th>
        </tr>

        <tr>
            <td>1</td>
            <td>笔记本电脑</td>
            <td>4999元</td>
            <td>5台</td>
            <td><img src="image/bijiben.jpg" alt="笔记本电脑" style="width:150px;height:80px;"></td>
            <td><a href="http://www.baidu.com">立即shopping</a></td>
        </tr>
          
        <tr>
            <td>2</td>
            <td>空调</td>
            <td>2999元</td>
            <td>10台</td>
            <td><img src="image/kongtiao.jpg" alt="空调" style="width:150px;height:80px;"></td>
            <td><a href="http://www.baidu.com">立即shopping</a></td>
        </tr>

        <tr>
            <td>3</td>
            <td>热水器</td>
            <td>3000元</td>
            <td>1台</td>
            <td><img src="image/reshuiqi.jpg" alt="热水器" style="width:150px;height:80px;"></td>
            <td><a href="http://www.baidu.com">立即shopping</a></td>

        </tr>

        <tr>
            <td>4</td>
            <td>办公桌</td>
            <td>3200元</td>
            <td>1台</td>
            <td><img src="image/bangongzhuo.jpg" alt="办公桌" style="width:150px;height:80px;"></td>
            <td><a href="http://www.baidu.com">立即shopping</a></td>
        </tr>

        <tr>
            <td>5</td>
            <td>电风扇</td>
            <td>4999元</td>
            <td>1台</td>
            <td><img src="image/fengshan.jpg" alt="电风扇" style="width:150px;height:80px;"></td>
            <td><a href="http://www.baidu.com">立即shopping</a></td>
        </tr>




    </table>


    <style type="text/css">
         
         table {text-align:center;border-collapse: collapse;width:900px;margin:20px auto;}

         table caption {font-size: 30px;color:green;font-weight:bold;font-family:微软雅黑;margin-bottom:20px;}

         table,th,td {border:1px solid #666;}

         table tr:first-child {background-color: #ccc;font-size:25px;font-family:微软雅黑;line-height:50px;}

         table tr:hover {background-color:#efefef; color:red;font-weight:bold;font-family:黑体;}

         table tr td img {padding:5px;border-radius: 10px;}

         table tr td a {text-decoration: none;width:200px;height:50px;padding:5px;border:1px solid red;background: white;color:red;border-radius: 8px;}

         table tr td a:hover {background: red;color:white;}



    </style>

</body>
</html>

运行实例 »

点击 "运行实例" 按钮查看在线实例

代码执行结果如下图

执行结果.jpg


声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议