传智播客设计学院简介网页代码

百科大全

更新时间：2025-10-05 11:52:1847

admin管理员组
文章数量:1794759

传智播客设计学院简介网页代码

项目任务

项目分析

1.该网页分为左右两大板块 2.左边为字图结合,可在图片处理工具中将图片设计好,再将该图片设为背景即可 3.左图中文字部分可用有序列表制作 4.左图制作好后,设置左浮动,在进行右边的文字简介编辑 5.右边文字可分为三个段落,分别编辑,并将"传智播客设计学院"字体加粗即可

下面我们来看代码 HTML 部分代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "www.w3/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="www.w3/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>传智博客设计学院首页</title> <link href="style.css" rel="stylesheet" type="text/css" /> </head> <body> <div class="one"> <h1>传智播客设计学院简介</h1> <p align="center">更新时间:2015年07月28日14时08分  来源:传智播客</p> <hr/> <div class="a"> <ul> <div class="ud"></div> <li>移动时代的主流设计师</li> <li>集中于IT企业</li> <li>门槛高  薪水很高</li> <li>竞争少  要求全方面人才</li> <li>所需技能:</li> <div class="b"></div> <li>平均月薪:6570</li> </ul> </div> <div> <p><span>    传智博客设计学院</span>注于平面设计师、网页设计师、UI设计师的培养。我们拥有专业的师资团队，清晰合理的课程架构，4个月的学习循序渐进、充实饱满，结合大量的案列和实战项目，毕业后相当于两年工作经验</p> <p><span>    传智博客设计学院</span>传智播客设计学院教给你的远远不止如何作图，在这里你将学到真正的设计素养和理念，成为平面、网页、UI设计都精通的全能设计师。</p> <p>    迄今为止<span>传智博客设计学院</span>已经培养出上万名设计师，遍布于各个大中型企业，同时，从传智播客走出去的学员也得到了各个企业的一致认可和好评。 </p> </div> </div> </body> </html> CSS部分代码 @charset "utf-8"; h1{ text-align:center; } .a{ height:275px; width:615px; background-image:url(images/1.png); float:left; }/* CSS Document */ .one{ height:400px; width:1030px; margin:50px; } ul{ color:red; font-size:9px; } .b{ height:100px; width:165px; } .ud{height:60px;} .div2{ float:left; } span{font-weight:bold} 最后效果图

总结

制作过程中,要灵活运用外内边距,冷静分析网页的元素构成,尽量减少代码长度,增强代码可读性

本文标签：播客设计学院网页代码简介

版权声明：本文标题：传智播客设计学院简介网页代码内容由林淑君副主任自发贡献，该文观点仅代表作者本人，转载请联系作者并注明出处：http://www.xiehuijuan.com/baike/1686815907a106418.html，本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。