上图中单纯的在p标签内换行,但是没有显示换行,怎么用初学经验解决
(仅是学习总结,相信还有其他的办法,但是现阶段html还没有学到,后期再加~)
古诗文文字示例
筹笔驿
抛掷南阳为主忧,北征东讨尽良筹。
时来天地皆同力,运去英雄不自由。
千里山河轻孺子,两朝冠剑恨谯周。
唯余岩下多情水,犹解年年傍驿流。
示例截图如下(去掉一些自己测试写的东西主要的留下了刚好能截全)
(仅为个人自学的一点点思考,如有错漏,欢迎留言指正,还有许多的问题呈现,敬请期待~~~)
段落是通过 <p> 标签定义的。
实际例子
<p>This is a paragraph</p> <p>This is another paragraph</p>
注释:浏览器会自动地在段落的前后添加空行。(<p> 是块级元素)
提示:使用空的段落标记 <p></p> 去插入一个空行是个坏习惯。用 <br /> 标签代替它!(但是不要用 <br /> 标签去创建列表。)
不要忘记结束标签
即使忘了使用结束标签,大多数浏览器也会正确地将 HTML 显示出来:
实际例子
<p>This is a paragraph <p>This is another paragraph
上面的例子在大多数浏览器中都没问题,但不要依赖这种做法。忘记使用结束标签会产生意想不到的结果和错误。
注释:在未来的 HTML 版本中,不允许省略结束标签。(现在开发已经不允许了)
提示:通过结束标签来关闭 HTML 是一种经得起未来考验的 HTML 编写方法。清楚地标记某个元素在何处开始,并在何处结束,不论对您还是对浏览器来说,都会使代码更容易理解。
如果您希望在不产生一个新段落的情况下进行换行(新行),请使用 <br /> 标签:
<p>This is<br />a para<br />graph with line breaks</p>
<br /> 元素是一个空的 HTML 元素。由于关闭标签没有任何意义,因此它没有结束标签。
<br> 还是 <br />
你会发现 <br> 与 <br /> 很相似。
在 XHTML、XML 以及未来的 HTML 版本中,不允许使用没有结束标签(闭合标签)的 HTML 元素。
即使 <br> 在所有浏览器中的显示都没有问题,使用 <br /> 也是更长远的保障。
我们无法确定 HTML 被显示的确切效果。屏幕的大小,以及对窗口的调整都可能导致不同的结果。
对于 HTML,您无法通过在 HTML 代码中添加额外的空格或换行来改变输出的效果。
当显示页面时,浏览器会移除源代码中多余的空格和空行。所有连续的空格或空行都会被算作一个空格。需要注意的是,HTML 代码中的所有连续的空行(换行)也被显示为一个空格。
标签 描述
<p> 定义段落。
<br /> 插入单个折行(换行)。
如果您觉得有用,麻烦点个赞,支持一下!!
欢迎提问与建议。
HTML简介
HTML是用来描述网页的一种语言,它是一种超文本标记语言,由一套标记标签组成,在制作网页时,HTML使用标记标签来描述网页。
发展史
HTML:Hyper Text Markup Language超文本标记语言
超文本标记语言—在1993年6月互联网工程工作小组工作案发布(并非标准)
HTML2.0—1995年11月作为RFC1866发布,在RFC2854于2000年6月发布之后被宣布过时。
HTML3.2—1996年1月14日,W3C推荐标准
HTML4.0—1997年12月18日,W3C推荐标准
HTML4.01(微小改进)—1999年12月24日,W3C推荐标准,2000年5月15日发布基本严格的HTML4.01语法,是国标标准化组织和国际电工委员会的标准
XHTML1.0—发布于2000年1月26日,是W3C推荐标准,后来经过修订于2002年8月1日重新发布
XHTML1.1—2001年5月31日发布
XHTML2.0是W3C的工作草案,由于改动过大,学习这个新技术的成本过高而最终胎死腹中,因此,现在最常用的还是XHTML1.0标准。
目前最新的版本为HTML5,它是2004年被提出,2007年被W3C接纳并成立新的HTML工作团队,
2008年1月22日公布HTML5第一份正式草案,
2012年12月17日HTML5规范正式定稿,
2013年5月6日,HTML5.1正式草案公布。
HTML 5作为最新版本,提供了一些新的元素和一些有趣的新特性,同时也建立了一些新的规则。这些元素、特性和规则的建立,提供了许多新的网页功能,如使用网页实现动态渲染图形、图表、图像和动画,以及不需要安装任何插件直接使用网页播放视频等。目前企业开发中也在增大使用HTML5的力度
HTML的优势
h1~h6
源代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>标题标签</title> </head> <body> <h1>这是一级标题</h1> <h2>这是二级标题</h2> <h3>这是三级标题</h3> <h4>这是四级标题</h4> <h5>这是五级标题</h5> <h6>这是六级标题</h6> <h7>这是七级标题</h7>效果怎么显示不出来呢??? <h1>这是一级标题</h1> </body> </html> |
浏览器预览效果
p标签为段落标签,br标签为换行标签
源代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>段落和换行标签</title> </head> <body> <h1>北京欢迎你</h1> <p>北京欢迎你,<br>为你开天辟地</p> <p>北京欢迎你,<br/>有有勇气就会有奇迹</p> </body> </html> |
浏览器预览效果图
hr标签为水平线标签
源代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>水平线标签</title> </head> <body> <h1>漂洋过海来看你</h1> <hr> <p>为你我用了半年的积蓄,<br>漂洋过海来看你</p> <hr/> </body> </html> |
浏览器预览效果图
em为斜体标签,strong为字体加粗标签
源代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>字体样式标签</title> </head> <body> <h1>漂洋过海来看你</h1> <hr> <p>为你我用了<em>2017</em>半年的<strong><em>积蓄</em></strong>,<br> <em><strong>漂洋过海</strong></em>来看你 </p> <hr/> </body> </html> |
浏览器预览效果图
注释使用:<!--被注释的内容-->
大于号:> great than的缩写
小于号:< less than的缩写
双引号:""
版权符号:©
空格:
源代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>注释和特殊符号</title> </head> <body> <pre> 注释使用:<!--被注释的内容--> 大于号:> great than的缩写 小于号:< less than的缩写 双引号:"" 版权符号:© 空格: </pre> <!-- 我是被注释的内容,我只留给你们看,不会在页面上显示 --> 5<10>6 <br> "我是被双引号引起来的内容"<br> ©自由职业开发者公司<br> 我是 测试 空 格的 </body> </html> |
浏览器预览效果图
以上就是HTML的简单入门,后续带大家更深入的了解HTML
*请认真填写需求信息,我们会在24小时内与您取得联系。