“基础综合项目(一)”的版本间的差异
来自CloudWiki
(创建页面,内容为“==盒子的流式布局== *盒子的上下方向的边距根据具体需求来设置,左右方向的边距则设置为auto, 即margin:值1 auto 值2;,或者ma…”) |
|||
第1行: | 第1行: | ||
==盒子的流式布局== | ==盒子的流式布局== | ||
− | + | *[[文件:w4-38.png]] | |
− | + | *源代码: | |
− | |||
− | |||
− | |||
− | *[[文件: | ||
− | * | ||
− | |||
<nowiki><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> | <nowiki><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> | ||
<html xmlns="http://www.w3.org/1999/xhtml"> | <html xmlns="http://www.w3.org/1999/xhtml"> | ||
第14行: | 第8行: | ||
<title>无标题文档</title> | <title>无标题文档</title> | ||
<style type="text/css"> | <style type="text/css"> | ||
+ | *{letter-spacing:0.2em;} | ||
h2{text-align:center;} | h2{text-align:center;} | ||
p{text-align:left;} | p{text-align:left;} | ||
− | #layer1{width:100%; height:100px; background: | + | h3{text-align:center;} |
− | #layer2{width:70%; height: | + | |
− | #layer3{width:100%; height:30px; background: | + | #layer1{width:100%; height:100px; background:#074C97;color:white;text-align:center;} |
+ | #layer2{width:70%; height:auto;margin:0px auto;color:black;} | ||
+ | |||
+ | #layer3{width:100%; height:30px; background:#074C97;color:white;text-align:center;} | ||
+ | |||
+ | .content p{text-indent:2em;line-height:150%;} | ||
+ | #source {text-align:right;} | ||
</style> | </style> | ||
第24行: | 第25行: | ||
<body> | <body> | ||
<div id="layer1"><h1>山东商业职业技术学院</h1></div> | <div id="layer1"><h1>山东商业职业技术学院</h1></div> | ||
− | <div id="layer2"> | + | <div id="layer2" class="content"> |
− | < | + | <h3>学院简介</h3> |
− | + | <hr /> | |
− | + | ||
+ | <p>山东商业职业技术学院是1999年经教育部批准设立的省属高职院校,办学历史可追溯到1936年的济南惠鲁商业学校。 | ||
+ | 经过80多年的积淀,学校以“立德树人 兴商润民”为使命,以建设“创业型高水平商科院校”为目标愿景,秉承 “尚德蕴能,日精日新”的校训, | ||
+ | 坚持“经营、创新、开放、共生”的发展理念,坚持为社会用人需求服务,为学生就业成才服务,为学生终生幸福奠基, | ||
+ | 教学质量、办学特色得到社会各界的广泛肯定。</p> | ||
+ | |||
+ | <p>学校是国家示范性高职院校、全国职业教育先进单位、全国普通高等学校毕业生就业工作先进集体、全国毕业生就业典型经验高校、 | ||
+ | 全国创新创业典型经验高校、全国高校实践育人创新创业基地、全省教育工作先进单位、山东省德育示范高校。学校建有山东省农产品 | ||
+ | 贮运保鲜技术实验室、北方现代物流研究所、济南市肉品质量安全控制工程技术研究中心、济南市农产品质量安全监控信息化工程技术 | ||
+ | 研究中心等省市级科研机构。依托鲁商集团,建有国家农产品现代物流工程技术研究中心。</p> | ||
+ | |||
+ | <p id="source"><i>来源:党群部</i></p> | ||
</div> | </div> | ||
− | <div id="layer3"> | + | <div id="layer3">学校地址:济南市旅游路4516号 邮编:250103</div> |
</body> | </body> | ||
− | </html> | + | </html></nowiki> |
− | </nowiki> | ||
− | |||
− | |||
==盒子的嵌套布局== | ==盒子的嵌套布局== | ||
+ | *[[文件:w4-39.png]] | ||
+ | *源代码: | ||
+ | <nowiki><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> | ||
+ | <html xmlns="http://www.w3.org/1999/xhtml"> | ||
+ | <head> | ||
+ | <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> | ||
+ | <title>无标题文档</title> | ||
+ | <style type="text/css"> | ||
+ | *{letter-spacing:0.2em;} | ||
+ | h2{text-align:center;} | ||
+ | p{text-align:left;} | ||
+ | h3{text-align:center;} | ||
+ | |||
+ | #layer1{width:100%; height:100px; background:#074C97;color:white;text-align:center;} | ||
+ | #layer1 h1{height:100px;line-height:100px;} | ||
+ | #layer2{width:100%; height:auto;margin:0px auto;color:black;} | ||
+ | #layer2-1{ | ||
+ | width:30%; height:auto; | ||
+ | padding-top:2%;margin:0 auto; | ||
+ | color:black;text-align:center;float:left; | ||
+ | } | ||
+ | #layer2-1 p{text-align:center;line-height:250%;} | ||
+ | #layer2-2{ | ||
+ | width:60%; height:auto; | ||
+ | margin:0 auto;color:black; | ||
+ | text-align:center;float:left; | ||
+ | } | ||
+ | .content p{text-indent:2em;line-height:150%;} | ||
+ | #source {text-align:right;} | ||
+ | #layer2-3{clear:both;} | ||
+ | #layer3{ | ||
+ | width:100%; height:30px; | ||
+ | background:#074C97;color:white; | ||
+ | text-align:center; | ||
+ | } | ||
+ | #layer3 p{ | ||
+ | height:30px;line-height:30px; | ||
+ | text-align:center; | ||
+ | } | ||
+ | |||
+ | |||
+ | </style> | ||
+ | </head> | ||
+ | <body> | ||
+ | <div id="layer1"><h1>山东商业职业技术学院</h1></div> | ||
+ | <div id="layer2" > | ||
+ | <div id="layer2-1"> | ||
+ | <p>学校概况</p> | ||
+ | <p>机构设置</p> | ||
+ | <p>教育教学</p> | ||
+ | <p>创新创业</p> | ||
+ | <p>科技服务</p> | ||
+ | |||
+ | </div> | ||
+ | <div id="layer2-2" class="content"> | ||
+ | <h3>学院简介</h3> | ||
+ | <hr /> | ||
+ | |||
+ | <p>山东商业职业技术学院是1999年经教育部批准设立的省属高职院校,办学历史可追溯到1936年的济南惠鲁商业学校。 | ||
+ | 经过80多年的积淀,学校以“立德树人 兴商润民”为使命,以建设“创业型高水平商科院校”为目标愿景,秉承 “尚德蕴能,日精日新”的校训, | ||
+ | 坚持“经营、创新、开放、共生”的发展理念,坚持为社会用人需求服务,为学生就业成才服务,为学生终生幸福奠基, | ||
+ | 教学质量、办学特色得到社会各界的广泛肯定。</p> | ||
+ | |||
+ | <p>学校是国家示范性高职院校、全国职业教育先进单位、全国普通高等学校毕业生就业工作先进集体、全国毕业生就业典型经验高校、 | ||
+ | 全国创新创业典型经验高校、全国高校实践育人创新创业基地、全省教育工作先进单位、山东省德育示范高校。学校建有山东省农产品 | ||
+ | 贮运保鲜技术实验室、北方现代物流研究所、济南市肉品质量安全控制工程技术研究中心、济南市农产品质量安全监控信息化工程技术 | ||
+ | 研究中心等省市级科研机构。依托鲁商集团,建有国家农产品现代物流工程技术研究中心。</p> | ||
+ | |||
+ | <p id="source"><i>来源:党群部</i></p> | ||
+ | </div> | ||
+ | <div id="layer2-3"></div> | ||
+ | </div> | ||
+ | <div id="layer3"><p>学校地址:济南市旅游路4516号 邮编:250103</p></div> | ||
+ | </body> | ||
+ | </html></nowiki> | ||
==给页面添加图片和链接== | ==给页面添加图片和链接== | ||
+ | *[[文件:w4-40.png]] | ||
+ | *源代码: | ||
+ | <nowiki><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> | ||
+ | <html xmlns="http://www.w3.org/1999/xhtml"> | ||
+ | <head> | ||
+ | <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> | ||
+ | <title>无标题文档</title> | ||
+ | <style type="text/css"> | ||
+ | *{letter-spacing:0.2em;} | ||
+ | h2{text-align:center;} | ||
+ | p{text-align:left;} | ||
+ | h3{text-align:center;} | ||
+ | |||
+ | #layer1{width:100%; height:100px; background:#074C97;color:white;text-align:center;} | ||
+ | #layer1 h1{height:100px;line-height:100px;} | ||
+ | #layer2{width:100%; height:auto;margin:0px auto;color:black;} | ||
+ | #layer2-1{ | ||
+ | width:30%; height:auto; | ||
+ | padding-top:2%;margin:0 auto; | ||
+ | color:black;text-align:center;float:left; | ||
+ | } | ||
+ | #layer2-1 p{text-align:center;line-height:250%;} | ||
+ | #layer2-2{ | ||
+ | width:60%; height:auto; | ||
+ | margin:0 auto;color:black; | ||
+ | text-align:center;float:left; | ||
+ | } | ||
+ | .content p{text-indent:2em;line-height:150%;} | ||
+ | .content_img {width:300px;float:left;padding:5px; margin:5px 15px 15px 0; } | ||
+ | #source {text-align:right;} | ||
+ | #layer2-3{clear:both;} | ||
+ | #layer3{ | ||
+ | width:100%; height:30px; | ||
+ | background:#074C97;color:white; | ||
+ | text-align:center; | ||
+ | } | ||
+ | #layer3 p{ | ||
+ | height:30px;line-height:30px; | ||
+ | text-align:center; | ||
+ | } | ||
+ | |||
+ | |||
+ | </style> | ||
+ | </head> | ||
+ | <body> | ||
+ | <div id="layer1"><h1>山东商业职业技术学院</h1></div> | ||
+ | <div id="layer2" > | ||
+ | <div id="layer2-1"> | ||
+ | <p><a href="">学校概况</a></p> | ||
+ | <p><a href="">机构设置</a></p> | ||
+ | <p><a href="">教育教学</a></p> | ||
+ | <p><a href="">创新创业</a></p> | ||
+ | <p><a href="">科技服务</a></p> | ||
+ | |||
+ | </div> | ||
+ | <div id="layer2-2" class="content"> | ||
+ | <h3>学院简介</h3> | ||
+ | <hr /> | ||
+ | <img class="content_img" src="photo7.jpg"> | ||
+ | <p>山东商业职业技术学院是1999年经教育部批准设立的省属高职院校,办学历史可追溯到1936年的济南惠鲁商业学校。 | ||
+ | 经过80多年的积淀,学校以“立德树人 兴商润民”为使命,以建设“创业型高水平商科院校”为目标愿景,秉承 “尚德蕴能,日精日新”的校训, | ||
+ | 坚持“经营、创新、开放、共生”的发展理念,坚持为社会用人需求服务,为学生就业成才服务,为学生终生幸福奠基, | ||
+ | 教学质量、办学特色得到社会各界的广泛肯定。</p> | ||
+ | |||
+ | <p>学校是国家示范性高职院校、全国职业教育先进单位、全国普通高等学校毕业生就业工作先进集体、全国毕业生就业典型经验高校、 | ||
+ | 全国创新创业典型经验高校、全国高校实践育人创新创业基地、全省教育工作先进单位、山东省德育示范高校。学校建有山东省农产品 | ||
+ | 贮运保鲜技术实验室、北方现代物流研究所、济南市肉品质量安全控制工程技术研究中心、济南市农产品质量安全监控信息化工程技术 | ||
+ | 研究中心等省市级科研机构。依托鲁商集团,建有国家农产品现代物流工程技术研究中心。</p> | ||
+ | |||
+ | <p id="source"><i>来源:党群部</i></p> | ||
+ | </div> | ||
+ | <div id="layer2-3"></div> | ||
+ | </div> | ||
+ | <div id="layer3"><p>学校地址:济南市旅游路4516号 邮编:250103</p></div> | ||
+ | </body> | ||
+ | </html></nowiki> | ||
==添加导航菜单== | ==添加导航菜单== | ||
+ | *[[文件:w4-41.png]] | ||
+ | *源代码: | ||
+ | <nowiki><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> | ||
+ | <html xmlns="http://www.w3.org/1999/xhtml"> | ||
+ | <head> | ||
+ | <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> | ||
+ | <title>无标题文档</title> | ||
+ | <style type="text/css"> | ||
+ | *{letter-spacing:0.2em;} | ||
+ | h2{text-align:center;} | ||
+ | p{text-align:left;} | ||
+ | h3{text-align:center;} | ||
+ | |||
+ | #layer1{width:100%; height:100px; background:#074C97;color:white;text-align:center;} | ||
+ | #layer1 h1{height:100px;line-height:100px;} | ||
+ | #layer2{width:100%; height:auto;margin:0px auto;color:black;} | ||
+ | #navigation{ | ||
+ | width:30%; height:auto; | ||
+ | font-weight:bold; | ||
+ | font-size:1em; | ||
+ | text-align:center; /* 这个属性使盒子中的链接居中 */ | ||
+ | margin:0 auto; | ||
+ | padding-top:30px; | ||
+ | float:left; | ||
+ | } | ||
+ | #navigation a{ | ||
+ | |||
+ | width:90%; | ||
+ | display:block; | ||
+ | height:5em; | ||
+ | line-height:4em; | ||
+ | color:#FFFFFF; | ||
+ | background-color:#1136c1; | ||
+ | |||
+ | text-decoration:none; | ||
+ | border-top:1px solid white; | ||
+ | border-left:12px solid #151571; /* 左边的粗边 */ | ||
+ | |||
+ | } | ||
+ | #navigation a:hover{ /* 鼠标经过时 */ | ||
+ | background-color:#002099; /* 改变背景色 */ | ||
+ | color:#ffff00; /* 改变文字颜色 */ | ||
+ | border-left:12px solid yellow; | ||
+ | } | ||
+ | #layer2-2{ | ||
+ | width:60%; height:auto; | ||
+ | margin:0 auto;color:black; | ||
+ | text-align:center;float:left; | ||
+ | } | ||
+ | .content p{text-indent:2em;line-height:150%;} | ||
+ | .content_img {width:300px;float:left;padding:5px; margin:5px 15px 15px 0; } | ||
+ | #source {text-align:right;} | ||
+ | #layer2-3{clear:both;} | ||
+ | #layer3{ | ||
+ | width:100%; height:30px; | ||
+ | background:#074C97;color:white; | ||
+ | text-align:center; | ||
+ | } | ||
+ | #layer3 p{ | ||
+ | height:30px;line-height:30px; | ||
+ | text-align:center; | ||
+ | } | ||
+ | |||
+ | |||
+ | </style> | ||
+ | </head> | ||
+ | <body> | ||
+ | <div id="layer1"><h1>山东商业职业技术学院</h1></div> | ||
+ | <div id="layer2" > | ||
+ | <div id="navigation"> | ||
+ | <a href="">学校概况</a> | ||
+ | <a href="">机构设置</a> | ||
+ | <a href="">教育教学</a> | ||
+ | <a href="">创新创业</a> | ||
+ | <a href="">科技服务</a> | ||
+ | |||
+ | </div> | ||
+ | <div id="layer2-2" class="content"> | ||
+ | <h3>学院简介</h3> | ||
+ | <hr /> | ||
+ | <img class="content_img" src="photo7.jpg"> | ||
+ | <p>山东商业职业技术学院是1999年经教育部批准设立的省属高职院校,办学历史可追溯到1936年的济南惠鲁商业学校。 | ||
+ | 经过80多年的积淀,学校以“立德树人 兴商润民”为使命,以建设“创业型高水平商科院校”为目标愿景,秉承 “尚德蕴能,日精日新”的校训, | ||
+ | 坚持“经营、创新、开放、共生”的发展理念,坚持为社会用人需求服务,为学生就业成才服务,为学生终生幸福奠基, | ||
+ | 教学质量、办学特色得到社会各界的广泛肯定。</p> | ||
+ | |||
+ | <p>学校是国家示范性高职院校、全国职业教育先进单位、全国普通高等学校毕业生就业工作先进集体、全国毕业生就业典型经验高校、 | ||
+ | 全国创新创业典型经验高校、全国高校实践育人创新创业基地、全省教育工作先进单位、山东省德育示范高校。学校建有山东省农产品 | ||
+ | 贮运保鲜技术实验室、北方现代物流研究所、济南市肉品质量安全控制工程技术研究中心、济南市农产品质量安全监控信息化工程技术 | ||
+ | 研究中心等省市级科研机构。依托鲁商集团,建有国家农产品现代物流工程技术研究中心。</p> | ||
+ | |||
+ | <p id="source"><i>来源:党群部</i></p> | ||
+ | </div> | ||
+ | <div id="layer2-3"></div> | ||
+ | </div> | ||
+ | <div id="layer3"><p>学校地址:济南市旅游路4516号 邮编:250103</p></div> | ||
+ | </body> | ||
+ | </html></nowiki> |
2017年11月23日 (四) 15:33的版本
盒子的流式布局
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> <style type="text/css"> *{letter-spacing:0.2em;} h2{text-align:center;} p{text-align:left;} h3{text-align:center;} #layer1{width:100%; height:100px; background:#074C97;color:white;text-align:center;} #layer2{width:70%; height:auto;margin:0px auto;color:black;} #layer3{width:100%; height:30px; background:#074C97;color:white;text-align:center;} .content p{text-indent:2em;line-height:150%;} #source {text-align:right;} </style> </head> <body> <div id="layer1"><h1>山东商业职业技术学院</h1></div> <div id="layer2" class="content"> <h3>学院简介</h3> <hr /> <p>山东商业职业技术学院是1999年经教育部批准设立的省属高职院校,办学历史可追溯到1936年的济南惠鲁商业学校。 经过80多年的积淀,学校以“立德树人 兴商润民”为使命,以建设“创业型高水平商科院校”为目标愿景,秉承 “尚德蕴能,日精日新”的校训, 坚持“经营、创新、开放、共生”的发展理念,坚持为社会用人需求服务,为学生就业成才服务,为学生终生幸福奠基, 教学质量、办学特色得到社会各界的广泛肯定。</p> <p>学校是国家示范性高职院校、全国职业教育先进单位、全国普通高等学校毕业生就业工作先进集体、全国毕业生就业典型经验高校、 全国创新创业典型经验高校、全国高校实践育人创新创业基地、全省教育工作先进单位、山东省德育示范高校。学校建有山东省农产品 贮运保鲜技术实验室、北方现代物流研究所、济南市肉品质量安全控制工程技术研究中心、济南市农产品质量安全监控信息化工程技术 研究中心等省市级科研机构。依托鲁商集团,建有国家农产品现代物流工程技术研究中心。</p> <p id="source"><i>来源:党群部</i></p> </div> <div id="layer3">学校地址:济南市旅游路4516号 邮编:250103</div> </body> </html>
盒子的嵌套布局
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> <style type="text/css"> *{letter-spacing:0.2em;} h2{text-align:center;} p{text-align:left;} h3{text-align:center;} #layer1{width:100%; height:100px; background:#074C97;color:white;text-align:center;} #layer1 h1{height:100px;line-height:100px;} #layer2{width:100%; height:auto;margin:0px auto;color:black;} #layer2-1{ width:30%; height:auto; padding-top:2%;margin:0 auto; color:black;text-align:center;float:left; } #layer2-1 p{text-align:center;line-height:250%;} #layer2-2{ width:60%; height:auto; margin:0 auto;color:black; text-align:center;float:left; } .content p{text-indent:2em;line-height:150%;} #source {text-align:right;} #layer2-3{clear:both;} #layer3{ width:100%; height:30px; background:#074C97;color:white; text-align:center; } #layer3 p{ height:30px;line-height:30px; text-align:center; } </style> </head> <body> <div id="layer1"><h1>山东商业职业技术学院</h1></div> <div id="layer2" > <div id="layer2-1"> <p>学校概况</p> <p>机构设置</p> <p>教育教学</p> <p>创新创业</p> <p>科技服务</p> </div> <div id="layer2-2" class="content"> <h3>学院简介</h3> <hr /> <p>山东商业职业技术学院是1999年经教育部批准设立的省属高职院校,办学历史可追溯到1936年的济南惠鲁商业学校。 经过80多年的积淀,学校以“立德树人 兴商润民”为使命,以建设“创业型高水平商科院校”为目标愿景,秉承 “尚德蕴能,日精日新”的校训, 坚持“经营、创新、开放、共生”的发展理念,坚持为社会用人需求服务,为学生就业成才服务,为学生终生幸福奠基, 教学质量、办学特色得到社会各界的广泛肯定。</p> <p>学校是国家示范性高职院校、全国职业教育先进单位、全国普通高等学校毕业生就业工作先进集体、全国毕业生就业典型经验高校、 全国创新创业典型经验高校、全国高校实践育人创新创业基地、全省教育工作先进单位、山东省德育示范高校。学校建有山东省农产品 贮运保鲜技术实验室、北方现代物流研究所、济南市肉品质量安全控制工程技术研究中心、济南市农产品质量安全监控信息化工程技术 研究中心等省市级科研机构。依托鲁商集团,建有国家农产品现代物流工程技术研究中心。</p> <p id="source"><i>来源:党群部</i></p> </div> <div id="layer2-3"></div> </div> <div id="layer3"><p>学校地址:济南市旅游路4516号 邮编:250103</p></div> </body> </html>
给页面添加图片和链接
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> <style type="text/css"> *{letter-spacing:0.2em;} h2{text-align:center;} p{text-align:left;} h3{text-align:center;} #layer1{width:100%; height:100px; background:#074C97;color:white;text-align:center;} #layer1 h1{height:100px;line-height:100px;} #layer2{width:100%; height:auto;margin:0px auto;color:black;} #layer2-1{ width:30%; height:auto; padding-top:2%;margin:0 auto; color:black;text-align:center;float:left; } #layer2-1 p{text-align:center;line-height:250%;} #layer2-2{ width:60%; height:auto; margin:0 auto;color:black; text-align:center;float:left; } .content p{text-indent:2em;line-height:150%;} .content_img {width:300px;float:left;padding:5px; margin:5px 15px 15px 0; } #source {text-align:right;} #layer2-3{clear:both;} #layer3{ width:100%; height:30px; background:#074C97;color:white; text-align:center; } #layer3 p{ height:30px;line-height:30px; text-align:center; } </style> </head> <body> <div id="layer1"><h1>山东商业职业技术学院</h1></div> <div id="layer2" > <div id="layer2-1"> <p><a href="">学校概况</a></p> <p><a href="">机构设置</a></p> <p><a href="">教育教学</a></p> <p><a href="">创新创业</a></p> <p><a href="">科技服务</a></p> </div> <div id="layer2-2" class="content"> <h3>学院简介</h3> <hr /> <img class="content_img" src="photo7.jpg"> <p>山东商业职业技术学院是1999年经教育部批准设立的省属高职院校,办学历史可追溯到1936年的济南惠鲁商业学校。 经过80多年的积淀,学校以“立德树人 兴商润民”为使命,以建设“创业型高水平商科院校”为目标愿景,秉承 “尚德蕴能,日精日新”的校训, 坚持“经营、创新、开放、共生”的发展理念,坚持为社会用人需求服务,为学生就业成才服务,为学生终生幸福奠基, 教学质量、办学特色得到社会各界的广泛肯定。</p> <p>学校是国家示范性高职院校、全国职业教育先进单位、全国普通高等学校毕业生就业工作先进集体、全国毕业生就业典型经验高校、 全国创新创业典型经验高校、全国高校实践育人创新创业基地、全省教育工作先进单位、山东省德育示范高校。学校建有山东省农产品 贮运保鲜技术实验室、北方现代物流研究所、济南市肉品质量安全控制工程技术研究中心、济南市农产品质量安全监控信息化工程技术 研究中心等省市级科研机构。依托鲁商集团,建有国家农产品现代物流工程技术研究中心。</p> <p id="source"><i>来源:党群部</i></p> </div> <div id="layer2-3"></div> </div> <div id="layer3"><p>学校地址:济南市旅游路4516号 邮编:250103</p></div> </body> </html>
添加导航菜单
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> <style type="text/css"> *{letter-spacing:0.2em;} h2{text-align:center;} p{text-align:left;} h3{text-align:center;} #layer1{width:100%; height:100px; background:#074C97;color:white;text-align:center;} #layer1 h1{height:100px;line-height:100px;} #layer2{width:100%; height:auto;margin:0px auto;color:black;} #navigation{ width:30%; height:auto; font-weight:bold; font-size:1em; text-align:center; /* 这个属性使盒子中的链接居中 */ margin:0 auto; padding-top:30px; float:left; } #navigation a{ width:90%; display:block; height:5em; line-height:4em; color:#FFFFFF; background-color:#1136c1; text-decoration:none; border-top:1px solid white; border-left:12px solid #151571; /* 左边的粗边 */ } #navigation a:hover{ /* 鼠标经过时 */ background-color:#002099; /* 改变背景色 */ color:#ffff00; /* 改变文字颜色 */ border-left:12px solid yellow; } #layer2-2{ width:60%; height:auto; margin:0 auto;color:black; text-align:center;float:left; } .content p{text-indent:2em;line-height:150%;} .content_img {width:300px;float:left;padding:5px; margin:5px 15px 15px 0; } #source {text-align:right;} #layer2-3{clear:both;} #layer3{ width:100%; height:30px; background:#074C97;color:white; text-align:center; } #layer3 p{ height:30px;line-height:30px; text-align:center; } </style> </head> <body> <div id="layer1"><h1>山东商业职业技术学院</h1></div> <div id="layer2" > <div id="navigation"> <a href="">学校概况</a> <a href="">机构设置</a> <a href="">教育教学</a> <a href="">创新创业</a> <a href="">科技服务</a> </div> <div id="layer2-2" class="content"> <h3>学院简介</h3> <hr /> <img class="content_img" src="photo7.jpg"> <p>山东商业职业技术学院是1999年经教育部批准设立的省属高职院校,办学历史可追溯到1936年的济南惠鲁商业学校。 经过80多年的积淀,学校以“立德树人 兴商润民”为使命,以建设“创业型高水平商科院校”为目标愿景,秉承 “尚德蕴能,日精日新”的校训, 坚持“经营、创新、开放、共生”的发展理念,坚持为社会用人需求服务,为学生就业成才服务,为学生终生幸福奠基, 教学质量、办学特色得到社会各界的广泛肯定。</p> <p>学校是国家示范性高职院校、全国职业教育先进单位、全国普通高等学校毕业生就业工作先进集体、全国毕业生就业典型经验高校、 全国创新创业典型经验高校、全国高校实践育人创新创业基地、全省教育工作先进单位、山东省德育示范高校。学校建有山东省农产品 贮运保鲜技术实验室、北方现代物流研究所、济南市肉品质量安全控制工程技术研究中心、济南市农产品质量安全监控信息化工程技术 研究中心等省市级科研机构。依托鲁商集团,建有国家农产品现代物流工程技术研究中心。</p> <p id="source"><i>来源:党群部</i></p> </div> <div id="layer2-3"></div> </div> <div id="layer3"><p>学校地址:济南市旅游路4516号 邮编:250103</p></div> </body> </html>