一、作品介绍
HTML实例网页代码,本实例适合于初学HTML的同学。该实例里面有设置了css的样式设置，有div的样式格局，这个实例比较全面，有助于同学的学习,本文将介绍如何通过从头开始设计个人网站并将其转换为代码的过程来实践设计。
二、作品效果截图演示三、作品代码隣HTML代码!DOCTYPEhtmlhtmllang="en"headmetacharset="utf-8"title红酒/titlelinkhref="css/style.css"type="text/css"rel="stylesheet"media="all"/headbodydivclass="headclearfix"bclass="fl"imgsrc="images/logo.jpg"/bnavclass="fr"ahref="index.html"主页/aahref="about.html"红酒介绍/aahref="pic.html"红酒照片/aahref="news.html"红酒起源/aahref="info.html"红酒文化/aahref="sp.html"视频推荐/a/nav/divdivclass="mainclearfix"divclass="banner"imgsrc="images/timg.jpg"width="%"/divdivclass="div7bgclearfix"divclass=""ulid="jSearchHeroDiv"class="imgtextlist"liimgsrc="images/a1.jpg"/liliimgsrc="images/a2.jpg"/liliimgsrc="images/a3.jpg"/liliimgsrc="images/a4.jpg"/li/ul/div/divdivclass="div4bg"divclass="bar"h3红酒分类/h3/divdivclass="fr"divlabel-module="para"style="padding:10px;box-sizing:border-box;"divlabel-module="para"style="font-size:14px"目前世界上有超过6种可以酿酒的葡萄品种，可分为红葡萄酒、白葡萄酒、桃红葡萄酒，而红酒则是葡萄酒类目中的红葡萄酒类型。但能酿制出上好葡萄酒的葡萄品种只有50种左右，大致可以分为白葡萄和红葡萄两种。白葡萄，颜色有青绿色、黄色等，主要用于酿制起泡酒及白葡萄酒。brbr不管是红葡萄品种还是白葡萄品种，它们的生长特性及种植所必需的自然条件，比如气候、土壤、日照等因素都决定了每个葡萄酒产区对葡萄品种的选择，当然，一些传统和市场因素有时也会被掺杂其中。例如干燥炎热且常刮强风的法国罗讷河谷南部正是耐干热及强风的歌海娜（Grenache）品种的主要产地，而炎热的地中海气候则不适合种植早熟且喜严寒气候的黑皮诺（PinotNoir）brbr红酒多酚还可降低皮肤受刺激所引起的发炎反应;抑制酪胺酸酶活性,减少黑色素生成,让肌肤亮白;维持血管张力，防止微血管曲张,促进脂肪与醣类的代谢,消除橘皮组织现象。br/div/div/div/divdivclass="div2bg"divclass="bar"h3红酒/h3/divdivstyle="padding:5px;height:px;"p葡萄酒在大约公元前0年到前年之间在法国南部出现，而后它开始在地中海盆地的大部分地区进行繁衍传播。早期，这种饮料一直被视认是一种只有贵族才能享用的高尚饮品，也是一种用来敬拜酒神巴克斯（Bacchus）的祭神用品。红酒在全世界的基督教徒的心中还代表了耶稣基督的血液，这点促进了红酒的平民化，使得平常民众也拥有了饮用甘美的红酒的权利。红酒（Redwine）是葡萄、蓝莓等水果经过传统及科学方法相结合进行发酵的果酒。红酒比较典型的是葡萄红酒和蓝莓红酒，葡萄酒有许多分类方式。以成品颜色来说，可分为红葡萄酒、白葡萄酒及粉红葡萄酒三类。其中红葡萄酒又可细分为干红葡萄酒、半干红葡萄酒、半甜红葡萄酒和甜红葡萄酒，白葡萄酒则细分为干白葡萄酒、半干白葡萄酒、半甜白葡萄酒和甜白葡萄酒。粉红葡萄酒也叫桃红酒、玫瑰红酒。杨梅酿制的叫做杨梅红酒。还有一种蓝莓酿制的蓝莓红酒。/p/div/divdivclass="clearfix"/div/divdivclass="footer"葡萄酒/div/body/htmlCSS代码
/*CSSDocument*/a{font-size:14px;color:#D39;text-decoration:none}a:hover{color:#7c;}ul,li{list-style:none;margin:0;padding:0}.div2li{margin-left:20px}.div2lia{color:#FFFFFF}.div2{float:left;margin-top:20px;width:px;}#latest_guide_listli{border-bottom:#fffsolid1px;padding:10px}#latest_guide_listlia{color:#fff;}.div4{float:right;margin-top:20px;width:px}.footer{text-align:center;padding:30px0;color:#fff}.con{padding:20px}.title{color:#fff;text-align:center;font-size:24px;padding:20px0;}.div1img{float:left}.div7{margin-top:20px}form{margin:0;padding:35pxpx;width:px;}formlabel{display:block;margin:px;overflow:hidden;padding:0;}formlabelspan{color:#7d7c7c;display:block;font-size:13px;float:left;height:31px;margin:0;padding:5px14px00;text-align:right;text-transform:uppercase;width:74px;}formlabelinput{border:1pxsolid#d6d6d6;background:#fff;color:#7d7c7c;display:block;float:left;font-family:Arial,Helvetica,sans-serif;font-size:13px;height:34px;line-height:34px;margin:0;padding:05px;width:px;}formlabeltextarea{border:1pxsolid#d6d6d6;background:#fff;color:#7d7c7c;display:block;float:left;font-family:Arial,Helvetica,sans-serif;font-size:13px;height:px;margin:0;overflow:auto;padding:5px;width:px;}form#submit2{border:0;display:block;height:37px;margin:88px;padding:0;width:px;}.conimg{width:px;height:auto;}.renwu{font-weight:bold;}四、更多源码
从web基础、计算机基础到前端常用框架的教程，涵盖前端大部分必备知识（学习指南+技术文章+资源分享）