html+css结课作业.rar_html结课作业资源-CSDN文库

共73个文件

jpg：51个

png：10个

html：6个

html

网页制作

结课作业

室内盆栽

需积分: 46 42 浏览量 2020-06-06 14:22:49 上传评论 6 收藏 5.35MB RAR 举报

HTML和CSS是网页设计的基础，本项目是一个大一学生的结课作业，主要展示了利用这两种技术制作的关于室内盆栽植物，特别是多肉植物的网页。这个压缩包文件名为"html+css结课作业.rar"，其中包含了一个名为"关于绿植的css网页"的子文件，我们可以从这个项目中学习到以下丰富的知识点： 1. HTML基础结构：HTML（HyperText Markup Language）是网页内容的结构化标记语言，项目中的HTML文件会展示如何定义页面的基本元素，如标题（`<h1>`）、段落（`<p>`）、图片（`<img>`）以及链接（`<a>`）等。 2. CSS样式设计：CSS（Cascading Style Sheets）用于控制网页的布局和外观。在"关于绿植的css网页"中，我们可以看到如何使用CSS选择器来定位HTML元素，并应用样式，例如颜色、字体、大小、布局和背景等。 3. CSS盒模型：理解CSS盒模型对于网页布局至关重要。项目可能涉及到边距（margin）、填充（padding）、边框（border）和内容（content）的设置，这些都会影响元素的实际尺寸。 4. 盒模型布局：包括流体布局、网格布局、Flexbox（弹性盒布局）或Grid（CSS Grid布局），这些现代CSS布局技术可以帮助创建响应式和灵活的网页设计。根据项目的复杂性，可能会使用其中一种或多种。 5. 媒体查询（Media Queries）：为了实现响应式设计，即根据设备屏幕尺寸改变网页布局，项目可能包含了媒体查询，这样可以确保在不同设备上都有良好的用户体验。 6. 图片处理：HTML中使用`<img>`标签插入图片，并通过CSS控制图片大小、位置和对齐方式。项目可能还涉及了CSS的背景图片属性，如背景图层、背景大小和背景位置等。 7. CSS动画与过渡：为了增加网页的动态效果，可能会使用CSS的`transition`和`animation`属性，例如鼠标悬停时元素的平滑变化，或者自定义的动画效果。 8. 类与ID选择器：了解如何通过类（`.class`)和ID（`#id`）选择器来针对性地应用样式，这对于组织代码和提高可维护性非常重要。 9. 实例学习：这个结课作业是一个很好的实例，可以让我们实践并理解HTML和CSS在实际项目中的应用，尤其是关于室内盆栽和多肉植物的主题，可能涉及了特殊的设计元素，如绿色调、植物图案等。这个压缩包提供了一个学习和研究HTML和CSS实际应用的机会，无论你是初学者还是有一定经验的开发者，都可以从中受益。通过分析和拆解这个项目，你可以提升自己的网页设计技能，更好地理解和运用这两种语言。

资源推荐

资源详情

资源评论

收起资源包目录

关于绿植的css网页.rar （73个子文件）

关于绿植的css网页

lvzhi.html 9KB

renwen.css 2KB

zaipei.html 4KB

huiyuan.css 1KB

untitled.html 10KB

image

43.jpg 163KB

2.png 201KB

38.jpg 81KB

3.png 11KB

26.jpg 37KB

xian.png 2KB

qiu1.jpg 31KB

11.jpg 78KB

22.png 167KB

14.jpg 165KB

返回.png 3KB

21.jpg 15KB

5.png 23KB

31.jpg 66KB

51.jpg 26KB

58.jpg 20KB

28.jpg 41KB

37.jpg 62KB

35.jpg 65KB

6.png 359KB

12.jpg 96KB

17.jpg 943KB

素描2.jpg 41KB

41.jpg 58KB

36.jpg 61KB

1.png 13KB

39.jpg 66KB

29.jpg 28KB

52.jpg 37KB

59.jpg 32KB

25.jpg 49KB

15.jpg 109KB

13.jpg 99KB

33.jpg 31KB

logo.jpg 11KB

34.jpg 55KB

27.jpg 33KB

54.jpg 37KB

30.jpg 58KB

57.jpg 27KB

16.jpg 40KB

diyihangbeijing.jpg 28KB

555.gif 66B

18.jpg 24KB

10.jpg 82KB

timg.jpg 73KB

56.jpg 8KB

qiu2.jpg 25KB

1.jpg 130KB

24.jpg 28KB

4.png 153KB

7.jpg 91KB

9.jpg 97KB

53.jpg 25KB

素描1.jpg 34KB

55.jpg 31KB

23.jpg 37KB

42.jpg 53KB

40.jpg 73KB

20.png 1.14MB

8.jpg 66KB

19.jpg 80KB

index.html 2KB

untitled.css 3KB

lvzhi.css 2KB

zaipei.css 1KB

renwen.html 7KB

huiyuan.html 5KB

<!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <script type="text/javascript"> function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}} } function MM_swapImgRestore() { //v3.0 var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; } function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && d.getElementById) x=d.getElementById(n); return x; } function MM_swapImage() { //v3.0 var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];} } function MM_popupMsg(msg) { //v1.0 alert(msg); } </script> <link href="untitled.css" rel="stylesheet" type="text/css"> </head> <body onLoad="MM_preloadImages('image/6.png')"> <div id="quanju"> <table border="0" cellpadding="0" cellspacing="0"> <tbody> <tr id="hang"> <td id="diyihang"> <div id="logo"><img src="image/logo.jpg" width="76" height="76" alt=""/></div> <div id="xianrenz"><a href="index.html">仙人掌</a></div> <div id="daohang"> <ul> <li><a href="#">基本介绍</a></li> <li><a href="zaipei.html" onClick="MM_popupMsg('单击图片有惊喜！')">精美盆栽</a></li> <li><a href="renwen.html">仙人掌花语</a></li> <li><a href="lvzhi.html">其他绿植</a></li> <li><a href="huiyuan.html">会员注册</a></li> </ul> </div> </td> </tr> <tr> <td id="dierhang"> <div id="zhongjian"> <div id="img2"><img src="image/timg.jpg" alt="" width="510" height="350" id="Image1" onMouseOver="MM_swapImage('Image1','','image/6.png',1)" onMouseOut="MM_swapImgRestore()"/></div> <div id="zjyou"> <table width="702" border="1"> <tbody> <tr> <td colspan="2" class="tb1"><img src="image/1.png" width="100" height="100" alt=""/><b>基本介绍</b></td> </tr> <tr> <td width="564" height="154" class="tb2"><p>仙人掌（学名：Opuntia stricta (Haw.) Haw. var. dillenii (Ker-Gawl.) Benson ）是仙人掌科缩刺仙人掌的变种。丛生肉质灌木，高1.5-3米。上部分枝宽倒卵形、倒卵状椭圆形或近圆形，绿色至蓝绿色，无毛；刺黄色，有淡褐色横纹，坚硬；倒刺直立。叶钻形，绿色，早落。花辐状；花托倒卵形，基部渐狭，绿色；萼状花被黄色，</p></td> <td width="122" class="tb3" align="right" valign="top"><img src="image/2.png" width="189" height="152" alt=""/></td> </tr> <tr> <td height="132" colspan="2" class="tb4"><p>具绿色中肋；花丝淡黄色；花药黄色；花柱淡黄色；柱头黄白色。浆果倒卵球形，顶端凹陷，表面平滑无毛，紫红色，倒刺刚毛和钻形刺。种子多数，扁圆形，边缘稍不规则，无毛，淡黄褐色。花期(6-12)月。<br> 原产墨西哥、美国、西印度群岛、百慕大群岛和南美洲北部；中国于明末引种，南方沿海地区常见栽培。仙人掌喜光、耐旱，适合在中性、微碱性土壤生长。通常栽作围篱，茎供药用，浆果酸甜可食。</p><br><br></td> </tr> <tr> <td colspan="2" class="tb5" width="680" height="40"><b>形态特征</b></td> </tr> <tr> <td height="552" colspan="2" class="tb6"><p><br>仙人掌是一种沙漠植物，它那顽强的生命力令我敬佩不已。下面让我们看看它介绍吧！仙人掌的全身呈墨绿色，走近细察，你会发现它那椭圆形的厚厚的茎片上长着一簇簇白色的小刺。这小刺就是它的叶子，如果扎着了你，那你可得“哎哟”一阵子了。这可能是它保护自己的一种武器吧。<br> 别看仙人掌外表很丑，可它开的话赛过白牡丹，好像在装饰自己。一朵朵洁白如玉的小花还发出阵阵清香，真让人不由得想摘下一朵来。可这时的小刺就会提醒你“只许观赏，不许动手！”<br> 仙人掌的花期虽然非常短，只有一天花就凋谢了，但它的生命非常旺盛。无论“赤日炎炎似火烧”的夏天，只要把它栽在土里，几天放在那儿没人关都没事，即便是“天寒地冻雪花飘”的冬天，它照样不变色，顽强地生长着。仙人球是仙人掌仙人球是仙人掌类植物呈球状种类的总称，不仅品种繁多复杂，而且造型别致，多姿多彩，是百花园中一颗明珠。<br> 若讲究品位而言，大可种养一些“金琥”、“绯牡丹”、“龙王球”、“月宫殿”等一类的仙人球。不过，那一些普普通通的仙人球也很有“味道”，它们习性强健，容易栽培，花盆、泥盆、瓷盆、紫砂盆、塑盆都可以用，肥料也就是用草木灰、淘米水和酸奶的残渍等利用物。希望大家可别小看了仙人球，虽然品种普通平凡，但开出的花依然美丽，不会令人失望。不过，令人感叹的并不是仙人球美丽的花季，而是它大球生小球的繁殖期，看着那些吸附在母体身上的小球渐渐由小变大，深沉的母爱同样让人感慨万分。到了瓜熟蒂落时，这些仔球会脱离母体独自去开辟自己的天地，虽然是悄无声息，但对那些喜欢养植仙人球的人来说，当然不会对这一切熟视无睹一幅横联是这样描绘的：生仔落地球。我觉得不仅栩栩如生，而且一语双关，充满妙趣。</p><br><br></td> </tr> <tr> <td colspan="2" class="tb7" width="680" height="40"><b>食用价值</b></td> </tr> <tr> <td height="19" colspan="2" class="tb8"><br><p>有文献提示，仙人掌果是一种高蛋白、低脂肪、低糖、高膳食纤维的水果，亦富含维生素、矿物质、多糖类、黄酮类和果胶等营养成分，有益于预防心脑血管疾病、滋润肌肤。此外，多方面研究中也证明了，仙人掌果中提取的多糖物质在防治高血压、高血糖、高血脂和抗肿瘤方面有很好的作用。<br> 仙人掌含有丰富的维生素、矿物质及膳食纤维，还含有人体必需的8种氨基酸和多种微量元素，以及植物多糖等活性成分，不仅对人体有清热解毒、健胃补脾、清咽润肺、养颜护肤等诸多作用，还具有降血糖、降血脂、降血压的功效，对动脉硬化、糖尿病和肥胖病人有很好的辅助治疗作用。另外仙人掌它可以全株入药。四季可采。鲜用或者切片晒干都可以。有行气活血，清热解毒的功效。可以治痢疾，痔血，咳嗽，喉痛，肺痈，乳痈，疔疮，烫伤，以及蛇伤等。<br> 现在知道为什么选择这个植物抵御“僵尸”的袭击了吗？仙人掌是《植物大战僵尸》中的第 27 种植物，会通过发射尖刺对前方进行攻击，且能增高升空来攻击气球僵尸。在《植物大战僵尸 2》中，仙人掌是 Neon Mixtape Tour 的一个付费植物（$ 4.99），与 PvZ 1 不同，它会不断发射出能穿透数个目标的尖刺，且在僵尸靠近它后，仙人掌会藏进地面。这就相当于抵御外来之家！保护我们的健康和身体。</p></td> </tr> </tbody> </table> </div> <div id="zjzuo"><table width="406" border="1"> <tbody> <tr> <td width="396" height="85" class="zuotd1"><img src="image/4.png" width="56

评论收藏

内容反馈