用html和css怎么制作一个简单的网页
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">前面发的两篇关于html和css的<span style="color: black;">文案</span>，不<span style="color: black;">晓得</span><span style="color: black;">大众</span>看会了<span style="color: black;">无</span>呢，<span style="color: black;">暗里</span>有<span style="color: black;">无</span>操作呢。俗话说，学<span style="color: black;">导致</span>用，只学<span style="color: black;">不消</span>和没学没什么区别。</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">今天就用前两节的知识教<span style="color: black;">大众</span>一个简单的网页制作，可能有些陌生的知识，<span style="color: black;">自动</span>百度哦。</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">今天制作的<span style="color: black;">便是</span>关于茉莉花的，上面是<span style="color: black;">照片</span>下面是诗歌，先不给<span style="color: black;">大众</span>展示结果<span style="color: black;">照片</span>哦，嘿嘿嘿......（留一点<span style="color: black;">奥秘</span>感），在<span style="color: black;">文案</span>的最后展示效果图。</p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://pic4.zhimg.com/80/v2-2ec86185502c3293f69c9dd1490853e3_720w.webp" style="width: 50%; margin-bottom: 20px;"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">教程：</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">1，打开记事本，并在其中输入必要信息，完整代码如下：</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><!DOCTYPE html><html><head> <meta charset="utf-8"> <title></title></p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><body><header><img src="molihua.jpg"width="412" height="291"</header> <article> <header> <h2>茉莉花</h2> <p>作者：宋 · 刘克庄 </p> </header> <hr/> <p>曾与瑶姬约。恍相逢、翠裳摇曳，珠韝联络。风露青冥非人世，揽结玉龙骖鹤。</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">爱万朵、千条纤弱。</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">祷祝花神怜惜取，问开时、晴雨须斟酌。枝上雪，莫消却。</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">恼人匹似中狂药。</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">凭危栏、烛光交映，乐声遥作。身上春衫香薰透，看到参横月落。</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">算茉莉、犹低一著。坐有缑山王郎子，倚玉箫、度曲难为酢。君不饮，铸成错。</p> <h3>清平乐</h3> <p>冰轮万里。云卷天如洗。先向海山生大士。却诞卯金之子。冰盆荔子堪尝。胆瓶茉莉尤香。震旦人人炎热，补陀夜夜清凉。</p><dl> <dt>《浣溪沙》</dt> <dd>南国幽花比并香。直从初夏到秋凉</dd> <dt>《鹧鸪天》</dt> <dd>携靓侣，泛轻航。棹歌惊起野鸳鸯</dd> <dt>《真珠帘》</dt><dd>茉莉芰荷香，拍满笙箫院。</dd></p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"></dl></article> <footer>2019.9.6</footer> </body></html></p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><span style="color: black;">起步</span>浏览器运行后，<span style="color: black;">大众</span>会<span style="color: black;">发掘</span>界面并不美观，文字看着<span style="color: black;">亦</span>比较乱。</p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://pic2.zhimg.com/80/v2-2dad487b36d1d693eb7860baee85a8d5_720w.webp" style="width: 50%; margin-bottom: 20px;"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">为<span style="color: black;">认识</span>决这个问题，<span style="color: black;">能够</span>在界面添加css规则，让界面更好看，更标准化，将下面的代码块添加到记事本中，位置在<head>和<head/><span style="color: black;">亦</span>就是头部之间：</p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;"><style type="text/css">body{ bac<span style="color: black;">公斤</span>round:gray;} h2{ text-align:center;} header{ text-align:center; } article p{ text-indent:2em; } footer{ font-size:12px; font-align:center; } </style></p>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">再次<span style="color: black;">保留</span>和预览，是不是看着美观多了</p>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://pic3.zhimg.com/80/v2-c3728866e76937916780687ae8d3bfe2_720w.webp" style="width: 50%; margin-bottom: 20px;"></div>
<p style="font-size: 16px; color: black; line-height: 40px; text-align: left; margin-bottom: 15px;">是不是非常简单呢，<span style="color: black;">大众</span><span style="color: black;">能够</span>尝试一下。不懂的<span style="color: black;">能够</span>在下面评论中问哦</p>
太棒了、厉害、为你打call、点赞、非常精彩等。 百度seo优化论坛 http://www.fok120.com/ 在遇到你之前，我对人世间是否有真正的圣人是怀疑的。
页:
[1]