HTML第四章作业
学生实践4.1.3
1 <!doctype html>
2 <html>
3 <head>
4 <meta charset="utf-8">
5 <title>iPhone8红色特别版</title>
6 <link type="text/css" rel="stylesheet" href="style.css"/>
7 </head>
8
9 <body>
10 <div>
11 <h1>iPhone 8, 现更以红色呈现。</h1>
12 <h3><span>特别版</span></h3>
13 <p>
14 <a href="#">进一步了解 ></a>
15 <a href="#">购买 ></a>
16 </p>
17 <p>
18 <img src="img/iphone8.png"/>
19 </p>
20 </div>
21 </body>
22 </html>
学生实践4.2.4
1 <!doctype html>
2 <html>
3 <head>
4 <meta charset="utf-8">
5 <title>电脑分类</title>
6 <link type="text/css" rel="stylesheet" href="4.2.4.css"/>
7 </head>
8
9 <body>
10 <div id="menuList">
11 <!--第一行:标题-->
12 <div id="title">电脑分类</div>
13 <!--第二行:电脑整机-->
14 <div class="menultem">电脑整机</div>
15 <table class="menultem">
16 <tr>
17 <td><a href="#">笔记本</a></td>
18 <td><a href="#">轻薄本</a></td>
19 <td><a href="#">游戏本</a></td>
20 </tr>
21 <tr>
22 <td><a href="#">台式机</a></td>
23 <td><a href="#">一体机</a></td>
24 <td><a href="#">服务器</a></td>
25 </tr>
26 </table>
27 <!--第三行:电脑配件-->
28 <div class="menultem">电脑配件</div>
29 <table class="menultem">
30 <tr>
31 <td><a href="#">处理器</a></td>
32 <td><a href="#">显示器</a></td>
33 <td><a href="#">主机箱</a></td>
34 </tr>
35 <tr>
36 <td><a href="#">内存条</a></td>
37 <td><a href="#">硬盘</a></td>
38 <td><a href="#">主板</a></td>
39 </tr>
40 </table>
41 <!--第四行:外设产品-->
42 <div class="menultem">外设产品</div>
43 <table class="menultem">
44 <tr>
45 <td><a href="#">摄像头</a></td>
46 <td><a href="#">手写板</a></td>
47 <td><a href="#">鼠标垫</a></td>
48 </tr>
49 <tr>
50 <td><a href="#">键盘</a></td>
51 <td><a href="#">鼠标</a></td>
52 <td><a href="#">音响</a></td>
53 </tr>
54 </table>
55 </div>
56 </body>
57 </html>
学生实践4.3.5
1 <!doctype html>
2 <html>
3 <head>
4 <meta charset="utf-8">
5 <title>最新资讯</title>
6 <style type="text/css">
7 #container ul li a {
8 color: black;
9 text-decoration: none;
10 font-size: 12px;
11 }
12 #container ul li:hover a {
13 color: red;
14 }
15 #container ul li img{
16 height: 124px;
17 width: 152px;
18 display: none;
19 }
20 #container ul li:hover img{
21 display: block;
22 }
23 #container {
24 width: 250px;
25 }
26 #container ul li {
27 line-height: 25px;
28 }
29 </style>
30 </head>
31
32 <body>
33 <div id="container">
34 <h3>最新资讯</h3>
35 <div>
36 <ul>
37 <li>
38 <a href="#">诺基亚6正式发布!</a>
39 <img src="img/news_1.jpg"/>
40 </li>
41 <li>
42 <a href="#">BUY年,送360手机!</a>
43 <img src="img/news_2.jpg"/>
44 </li>
45 <li>
46 <a href="#">谁与争锋!iPad就送你</a>
47 <img src="img/news_3.jpg"/>
48 </li>
49 <li>
50 <a href="#">【调研】参加手机功能偏好调研!</a>
51 <img src="img/news_4.jpg"/>
52 </li>
53 <li>
54 <a href="#">艺术家的设计一般人看不懂!</a>
55 <img src="img/news_5.jpg"/>
56 </li>
57 <li>
58 <a href="#">报告显示Android设备比iPhone好!</a>
59 <img src="img/news_6.jpg"/>
60 </li>
61 </ul>
62 </div>
63 </div>
64 </body>
65 </html>
学生实践4.4.4
1 <!doctype html>
2 <html>
3 <head>
4 <meta charset="utf-8">
5 <title>优选品牌</title>
6 <link type="text/css" rel="stylesheet" href="4.4.4.css"/>
7 </head>
8
9 <body>
10 <div id="container">
11 <div>优选品牌</div>
12 <table border="1">
13 <tr>
14 <td background="img/logo_1.jpg"><div>ThinkPad 专场</div></td>
15 <td background="img/logo_2.jpg"><div>惠普专场</div></td>
16 <td background="img/logo_3.jpg"><div>联想专场</div></td>
17 <td background="img/logo_4.jpg"><div>华硕专场</div></td>
18 </tr>
19 <tr>
20 <td background="img/logo_5.jpg"><div>机械革命专场</div></td>
21 <td background="img/logo_6.jpg"><div>戴尔专场</div></td>
22 <td background="img/logo_7.jpg"><div>英特尔专场</div></td>
23 <td background="img/logo_8.jpg"><div>西数专场</div></td>
24 </tr>
25 </table>
26 </div>
27 </body>
28 </html>
HTML第四章作业的更多相关文章
- python 教程 第十四章、 地址薄作业
第十四章. 地址薄作业 #A Byte of Python #!/usr/bin/env python import cPickle import os #define the contacts fi ...
- web—第四章css&第五章
web—第四章css&第五章 终于迎接等待已久的CSS,在没学这个之前,我们只会用一点img,查一点小图片,或者是用style改一下颜色,而且比较麻烦.现在多了个css在文件夹在创建一个cs ...
- c++的路上,我坚信,我可以 -----第四次作业体会
第四次作业 传送门 1.浅谈"新对象"sstream和stack 第四次作业,就是在第三次作业上作修改,上周周末,我刚刚才完成了第三次作业,但是知道了队列如何应用,面对这次的sta ...
- CentOS7安装CDH 第十四章:CDH的优化
相关文章链接 CentOS7安装CDH 第一章:CentOS7系统安装 CentOS7安装CDH 第二章:CentOS7各个软件安装和启动 CentOS7安装CDH 第三章:CDH中的问题和解决方法 ...
- OOP第四章博客
OOP第四章博客作业 (1)本单元作业架构设计 1)针对于第一次作业,我是将所给类进行了自己的封装,在MyUmlInteraction类里面进行关系的建立,这里把所给的UmlClass建立好,同时有i ...
- 《Django By Example》第四章 中文 翻译 (个人学习,渣翻)
书籍出处:https://www.packtpub.com/web-development/django-example 原作者:Antonio Melé (译者注:祝大家新年快乐,这次带来<D ...
- 耿丹CS16-2班第四次作业汇总
Deadline: 2016-10-13 12:00 作业内容 实验3-1 分别使用while循环.do while循环.for循环求1+2+3+ --+100. 实验3-2 分别使用while循环. ...
- 《Linux内核设计与实现》读书笔记 第四章 进程调度
第四章进程调度 进程调度程序可看做在可运行太进程之间分配有限的处理器时间资源的内核子系统.调度程序是多任务操作系统的基础.通过调度程序的合理调度,系统资源才能最大限度地发挥作用,多进程才会有并发执行的 ...
- 《Entity Framework 6 Recipes》中文翻译系列 (20) -----第四章 ASP.NET MVC中使用实体框架之在MVC中构建一个CRUD示例
翻译的初衷以及为什么选择<Entity Framework 6 Recipes>来学习,请看本系列开篇 第四章 ASP.NET MVC中使用实体框架 ASP.NET是一个免费的Web框架 ...
- 《Entity Framework 6 Recipes》中文翻译系列 (21) -----第四章 ASP.NET MVC中使用实体框架之在页面中创建查询和使用ASP.NET URL路由过虑
翻译的初衷以及为什么选择<Entity Framework 6 Recipes>来学习,请看本系列开篇 4.2. 构建一个搜索查询 搜索数据是几乎所有应用的一个基本功能.它一般是动态的,因 ...
随机推荐
- Android MD5加密、RSA加密
现在公司做金融项目,需要考虑安全加密方面的问题.感谢大牛同事(冯哥) ,给我很大的帮助. 考虑到安全优化,我们把秘钥.加密步骤放到native中.考虑用到的技术:(1 )jni,(2 )OpenSSL ...
- python pip的使用
1.导出安装包 pip freeze > requirements.txt 2.安装requirements.txt文件中指定的扩展库:pip install -r requirement.tx ...
- 如何在Debian10镜像中设置Nginx引擎模块
目前,我们较多的服务器WEB环境都是用的Nginx引擎,我们采用服务器的目的是可以获取到更多的资源,而且建站数量是不受限制的.我们可以根据自己需要配置Nginx,可以自定义特定域的设置,允许您在单个服 ...
- What is REST and Restful?
什么是rest 和 restful? 提出rest的作者,目的:符合框架原理的情况下,理解和评估以网络为基础的应用软件的架构设计,得到一个功能强,性能好,适宜通讯的架构. Fielding将他对互联网 ...
- spring-cloud-alibaba-dubbo踩坑记
在https://start.aliyun.com/bootstrap.html下载了示例程序,用的版本如下: spring-boot:2.3.7.RELEASE spring-cloud-aliba ...
- ASP.NET Core Web API通过中间件或UseExceptionHandler异常处理方法
UseExceptionHandler app.UseExceptionHandler(configure => { configure.Run(async context => { va ...
- Ngrinder(性能测试工具)-(一)
一.ngrinder介绍 nGrinder 是基于Grinder开源项目,由NHN公司的开发团队进行了重新设计和完善. nGrinder 是一款非常易用,有简洁友好的用户界面 和 controller ...
- idea热部署插件JRebel激活
首先到github上去下载一个反向代理软件,我下载的是windows x64版本. https://github.com/ilanyu/ReverseProxy/releases/tag/v1.4 第 ...
- WDA学习(19):UI Element:Table使用
1.12 UI Element:Table使用 1.Table Filter and Sort 1.1创建Context节点; NODE_SFLIGHT, FILTER_COL:CARRID,CONN ...
- Linux基础第七章:磁盘阵列(RAID)
一.磁盘阵列 二.磁盘阵列类型 1.RAID 0 2.RAID 1 3.RAID 5 4.RAID10 三.磁盘阵列配置 1.硬件方式 2.软件方式 一.磁盘阵列独立硬盘冗余阵列(RAID, Redu ...