HTML写一个简单网页 |
您所在的位置：网站首页 › 用html写选择题代码怎么写的好看 › HTML写一个简单网页 |
HTML写一个简单网页
|
最近学习了一点HTML，闲来无事写个网页看看， 欢迎、改进、留言。 演示地点：跳转到演示地点 一、初始化页面 body,button,dd,dl, dt,form, h1, h2, h3, h4, h5, h6, hr, input, legend, li, ol, p, pre, td, textarea, th, ul,a,div,span { margin: 0; padding: 0; } ul{ list-style: none; } a{ text-decoration: none; } .clear{ clear: both;二、头部和底部 先给网页设置一个头部，具体代码如下： .header { padding: 80px; text-align: center; background: rgb(204, 191, 116); color: rgb(240, 232, 232); }再设置一个底部，具体代码如下： .footer { padding: 10px; text-align: center; background: #ddd; }运行结果如下：
三、整体 html代码如下： Document 花卉市场 牡丹 丁香 百合 美人蕉 夜来香 松果菊 锦葵 点击了解更多花卉 常见的花卉 松果菊、红丁香、锦葵、勋章菊等等都是比较常见的花卉 松果菊（学名：Echinacea purpurea (Linn.) Moench）是菊科松果菊属植物，多年生草本植物
原野生于加拿大的马尼托巴湖及萨斯喀彻温省的东南部及美国中南部的一些开阔树林、大草原上。 [3] 喜欢光照充足、温暖的气候条件 更多 松果菊可供药用，含有多种活性成分，可以刺激人体内的白细胞等免疫细胞的活力，具有增强免疫力的功效，还可以用于辅助治疗感冒、
花色泽艳丽，玉笑珠香，风流潇洒，富丽堂皇，素有“花中之王”的美誉。在栽培类型中，主要根据花的颜色，可分成上百个品种。 牡丹品种繁多，色泽亦多， 以黄、绿、肉红、深红、银红为上品，尤其黄、绿为贵。牡丹花大而香，故又有“国色天香”之称。 百合 百合，一种花 百合，中药名。为百合科植物卷丹Lilium lancifolium Thunb.、百合Lilium brownii F．E．Brown var. viridulum Baker 或细叶百合Lilium pumilum DC.的干燥肉质鳞叶。具有养阴润肺，清心安神之功效。常用于阴虚燥咳，劳嗽咳血，虚烦惊悸， 失眠多梦，精神恍惚。
一些小知识 《本草经疏》：“百合，主邪气腹胀。所谓邪气者，即邪热也。邪热在腹，故腹胀，清其邪热则胀消矣；解利心家之邪热， 则心痛自廖；肾主二便，肾与大肠二经有热邪则不通利， 清二经之邪热，则大小便自利；甘能补中，热清则气生，故补中益气；清热利小便，故除浮肿、胪胀、痞满、寒热， 通身疼痛。乳难，足阳明热也；喉痹者，手少阳三焦、 手少阴心家热也；涕泪，肺肝热也。清阳明三焦心部之热，则上来诸病自除。” 回到顶部 底部然后是CSS * { box-sizing: border-box; font-family: "宋体"; } /* body 样式 */ body { font-family: Arial; margin: 0; } /* 标题 */ .header { padding: 80px; text-align: center; background: rgb(204, 191, 116) color: rgb(240, 232, 232); } /* 标题字体加大 */ .header h1 { font-size: 40px; } /* 导航 */ .navbar { overflow: hidden; background-color: rgb(46, 46, } /* 导航栏样式 */ .navbar a { float: left; display: block; color: white; text-align: center; padding: 14px 40px; text-decoration: none; } /* 右侧链接*/ .navbar a.right { float: right; } /* 鼠标移动到链接的颜色 */ .navbar a:hover { background-color: #ddd; color: black; } /* 列容器 */ .row { display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } /* */ /* 创建两个列 */ /* 边栏 */ .side { -ms-flex: 30%; /* IE10 */ flex: 30%; background-color: #f1f1f1; padding: 20px; } /* 主要的内容区域 */ .main { -ms-flex: 70%; /* IE10 */ flex: 70%; background-color: white; padding: 20px; } /* 图片 */ .fff { background-color: rgb(247, 240 width: 100%; padding: 20px; } /* 底部 */ .footer { padding: 10px; text-align: center; background: #ddd; } /* 去下划线 */ a{ text-decoration: none; }最后就可以得到一个简单的网页啦！
欢迎大家留言，改进，建议！一起加油鸭* |
【本文地址】
今日新闻 |
推荐新闻 |