小狼的单身情话之HTML网页标签和段落的初级教学

欢迎来到单身情话之小狼版——情话微甜
如果你还是一个人，如果你有喜欢的人，如果你不想夜里孤独相伴，那么，就请你跟着小狼一起走进情话的世界吧！！
本文章适合新手，小白，初次接触HTML网页制作的朋友，如果有哪里写的不好，还请各位懂行的大佬评论区给小狼留言，以使小狼可以推送更加优质的内容哦！

上面两张图片为效果图
重点来了
亲爱的小伙伴，你们知道本节文章都用到了那些代码和知识点吗？
如果你们还不是很清楚的话，那么就跟随小狼一起去了解下，那些年，我们一起编辑的告白网页吧！！！
首先第一点，我们讲一下HTML网页的布局
html 网页分为 head 和 body 两部分组成
head 相当于我们的头，而 body 呢？
更像是我们的身体。至于HTML本身，则是用于开头和结尾的衔接。
简单点来讲，如果把HTML当成一个网页，那么HTML本身就是一个容器，想要在容器里盛东西，我们就要有合适的工具。
如此一来，就再也没有比 head 和 body 更好的了。
那么我们有了容器，就可以往里面放东西了，怎么放呢？放什么呢？
哎呀，这个问题可是难坏了我们的初学者，当初小狼刚开始学习的时候，也是一窍不通呢。
head 和 body 是一起的，也可以说是共通的，但是因为今天分享的内容题材有限，我们暂时不讲HTML的细化知识点。
就讲一讲你们所能看到的这些文字和进度条的由来吧！
文字的大小可以通过格式来调整，字体大小也还可以用font-size:14px;来控制,里面的14你可以随便改,最好是偶数一般为12或14都可以满足了。
这里小编直接使用了 h1 ~ h6 这样的一个标签。
其中 h1 标签最大 h6 标签最小，示例，你们可以参考本文章的字体大小，自己尝试下会有更深刻的理解。
那么段落问题我们应该怎么解决呢？
在这里，我们使用 span 和 p 标签，来解决我们的段落问题。
那么怎么使我们的文章看上去井然有序，像小编这样的呢？
我们使用换行符即可，换行符用 br ，注意每行的长度和你需要换行的字数哦。
那么看到这里，就有朋友问了，小狼小狼，你那个框框是怎么设置的鸭？我也好像学哦。
这个框框究竟是个什么东西呢？
各位朋友可以理解为：提示框，又或者对话框，解释框等等等等，具体看你用来做什么了。
首先我们用 dialog 代码定义标签
接着我们用 dt 作出提问
使用 dd 作出解释
这样一来，你们看到的框框就出现啦！！
怎么样？是不是很简单呢？
只看文字，你当然看不粗来，真实的效果是什么样子的啦！！
下面代码奉上，各位朋友，还请自行复制查看效果，并加以改进哦。


<html><head><h1>欢迎来到单身情话之小狼版——情话微甜</h1><h5>如果你还是一个人，如果你有喜欢的人，如果你不想夜里孤独相伴，那么，就请你跟着小狼一起走进情话的世界吧！！</h5><meta charset="UTF-8"><title>小狼的单身情话</title></head><body><!--canvas id="mycanvas" width="200" height="100"> </canvas--><h2>《 撩动你心弦 》顾小狼</h2><p> 早上好啊   我又来了哦   理我下下呀    <br>亲爱的，午好啊，今天工作辛苦啦，可以来玩下游戏散散心哦<br>为什么不回复我  哥哥又去钓鱼了吗.. <br>亲爱的，早上好，工作之余记得注意休息哦，休息之余记得理我下哦<br>早上好啊   我又来了哦   理我下下呀<br>对于世界而言，你是一个人；但是对于我，你是我的整个世界。<br>带你沉溺五湖四海，吃遍大街小巷，玩尽万水千山，然后，再跟我回家。<br>遇见你之前，我没有想过结婚，遇见你之后，结婚我没想过别人。<br>我爱你，不光因为你的样子，还因为，和你在一起时，我的样子。<br>狭路相逢勇者胜，温柔只给意中人。<br>你知道你和星星的区别吗，星星点亮了黑夜，而你点亮了我的心。<br>你问我有多喜欢你，我说不出来，但我心里明白，我宁愿跟你吵架也不愿意去爱别人。<br>这世界最烈的酒，是你低头噙笑的温柔。<br>我是个固执的人，从不愿挪动原则半分，可你来了之后，我的原则就成了你。<br>多想情窦初开是你，细水长流是你，柴米油盐是你，余生白首的也是你。<br>一生平淡无奇，偏偏遇见了你，我的心便波澜四起。<br><h3>怎么样？你学会怎么去和喜欢的女生告白了吗？什么？没有学会？那我们继续</h3>每发一次信息给你，天上就多一颗星星，于是，有了银河系。<br>执着地等待，哪怕是用一生。<br>你回我信息的时候呀 像一颗牛奶糖 从眉间甜到脚尖<br>我在等你。昨天，今天，明天······<br>我有两个可爱之处你知道吗？一个是我可爱 另一个是回我信息可爱的你了<br>最近有谣言说我喜欢你，我要澄清一下，那不是谣言<br>不和我聊天是怕我偷你的表情包吗？<br>等你回复是我每天必须的课程，跟你聊天是我一生中不变的承诺。<br>哥哥搬砖累嘛 小妹帮你捶捶背放松一下嘛哈哈<br><h3>怎么样亲爱的？你学费了吗？</h3><h4>接下来是正文，请仔细观看，多多尝试，下一位大佬就是你！</h4>既然学会了，那么我们接下来重点来介绍一下这篇文章的知识点<br>看一看你get到我们的重点画线部分了吗？<br>另外，本文章适合新手，小白，初次接触HTML网页制作的朋友，如果有哪里写的不好，还请各位懂行的大佬评论区给小狼留言，以使小狼可以推送更加优质的内容哦！<br><h1>重点来了</h1><h3>亲爱的小伙伴，你们知道本节文章都用到了那些代码和知识点吗？</h3><h5>如果你们还不是很清楚的话，那么就跟随小狼一起去了解下，那些年，我们一起编辑的告白网页吧！！！</h5>首先第一点，我们讲一下HTML网页的布局<br>html 网页分为 head 和 body 两部分组成<br>head 相当于我们的头， 而 body 呢？ <br>更像是我们的身体。至于HTML本身，则是用于开头和结尾的衔接。<br>简单点来讲，如果把HTML当成一个网页，那么HTML本身就是一个容器，想要在容器里盛东西，我们就要有合适的工具。<br>如此一来，就再也没有比 head 和 body 更好的了。<br>那么我们有了容器，就可以往里面放东西了，怎么放呢？放什么呢？<br>哎呀，这个问题可是难坏了我们的初学者，当初小狼刚开始学习的时候，也是一窍不通呢。<br>head 和 body 是一起的，也可以说是共通的，但是因为今天分享的内容题材有限，我们暂时不讲HTML的细化知识点。<br>就讲一讲你们所能看到的这些文字和进度条的由来吧！<br>文字的大小可以通过格式来调整，字体大小也还可以用font-size:14px;来控制,里面的14你可以随便改,最好是偶数一般为12或14都可以满足了。<br>这里小编直接使用了 h1 ~ h6 这样的一个标签。<br>其中 h1 标签最大   h6 标签最小 ，示例，你们可以参考本文章的字体大小，自己尝试下会有更深刻的理解。<br>那么段落问题我们应该怎么解决呢？<br>在这里，我们使用 span 和 p 标签，来解决我们的段落问题。<br>那么怎么使我们的文章看上去井然有序，像小编这样的呢？<br>我们使用换行符即可，换行符用 br ，注意每行的长度和你需要换行的字数哦。<br>那么看到这里，就有朋友问了，小狼小狼，你那个框框是怎么设置的鸭？我也好像学哦。<br>这个框框究竟是个什么东西呢？<br>各位朋友可以理解为：提示框，又或者对话框，解释框等等等等，具体看你用来做什么了。<br>首先我们用 dialog 代码定义标签 <br>接着我们用 dt 作出提问 <br>使用 dd 作出解释 <br>这样一来，你们看到的框框就出现啦！！<br>怎么样？是不是很简单呢？<br><h3>如果你学会了，那么就请多多关注小狼，小狼将带你走进HTML的新手殿堂，过五关，斩六将，终将坐上王者的宝座。</h3>
</p><dialog open>   <!--    dialog open 定义标签 --><dt>1.这篇文章的作者是谁？</dt>     <!--    dt 上联  dd 下联    可用于一问一答 --><dd>天魔缭乱之小狼</dd><dt>2.请说出你最喜欢的作者是谁？</dt><dd>当然是小狼啦</dd></dialog></body></html>

这篇文章主要用于HTML网页的初级教学，适合小白，效果可能看起来并不是那么的漂亮。
后面会逐步更新教学的，还请大家多多支持！！！
接下来是提问环节，下面的问题，不知道你答对了吗？
1.这篇文章的作者是谁？
天魔缭乱之小狼
2.请说出你最喜欢的作者是谁？
当然是小狼啦

小狼的单身情话之HTML网页标签和段落的初级教学相关推荐

BeautifulSoup 返回网页标签的名称、父标签名称、行号、完整路径
BeautifulSoup 返回网页标签的名称.父标签名称.行号.完整路径应用beatifulsoup完成网页标签的名称.父标签名称.行号.完整路径的获取,这里reversed实现对网页标签的遍历. ...
搜索引擎优化不是网页标签优化
很多朋友一谈到搜索引擎优化,总以为它是单一的网页标签优化处理,其实,这种观点是错误的. 搜索引擎优化,要做的有以下几步工作. 第一步:网站诊断网站结构诊断:看其是否适合搜索引擎习惯: 网站页面诊断: ...
前端如何设置浏览器网页标签页前的小图标favicon.ico
前端如何设置浏览器网页标签页前的小图标favicon.ico 步骤1: 将小图标favicon.ico文件(或者普通的icon小图片)放在项目的public或者static目录下步骤2: index ...
html网页显示蒙文,网页标签中显示蒙古文竖排文本
网页标签中显示蒙古文竖排文本蒙古文网页和我们经常见到的网页最大的区别在于,在网页中蒙古文文本的显示和编辑不同于其他的网站,蒙古文是竖排文本,并且不像汉文是从左向右书写文字,从上到下换行.而蒙古文是从 ...
Mac如何使用Safari一键静音和网页标签固定功能？
Mac怎么使用Safari一键静音和网页标签固定功能,尽管这些更新在火狐浏览器上早已出现,但Safari毕竟是原生的应用,更省电啊,下面分享解决办法.这里介绍Safari的一键静音的功能,网页的固定功 ...
HTML静态网页---标签
一. 创建HTML: (一) body的属性: bgcolor 页面背景色 background 背景壁纸.图片 text 文字颜色 topmargin 上边距 leftmargin ...
html普通文本和段落文本,HTML --- 网页文本与段落信息组织
网页文本与段落信息组织 1. 文本基本标记 1.1 字体属性face 语法: ... 1.2 字号属性size 语法: ... 1.3 颜色属性color 语法: ... 2 标题元素语法: - 标 ...
下列HTML标签是段落标签的是,HTML段落标签
HTML段落 HTML段落或HTML p标签用于定义网页中的段落.让我们举一个简单的例子来看看它是如何工作的.值得注意的一点是,浏览器本身在段落之前和之后添加一个空行. HTML 标签指示新段落的开始 ...
web快速入门之基础篇-html：2、基本标签之标题标签、段落标签、换行标签
目录一.前言二.简单实例介绍实例代码运行效果三.要点说明 1.h1到h6 标题标签 2.p 段落标签 3.br 换行标签[单标记] 一.前言上一篇文章我整理以前上学的笔记是初见 html ...

小狼的单身情话之HTML网页标签和段落的初级教学

小狼的单身情话之HTML网页标签和段落的初级教学相关推荐

最新文章

热门文章