适合0基础的web开发系列教程-换行和水平线

最近忙于期末考试命题，很久没有更新随笔了。

今天给大家总结的是换行和水平线

<br/> 可插入一个简单的换行符。

<hr/> 水平分隔线（horizontal rule）可以在视觉上将文档分隔成各个部分。

br和hr都双是单标签，不是成对出现的。

于是我们写下了这样的网页代码：

<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title></title></head><body>夜雨寄北作者：李商隐君问归期未有期，巴山夜雨涨秋池。何当共剪西窗烛，却话巴山夜雨时。</body>
</html>

显示效果却是这样：

全部排在了一行。

所以我们就需要对网页内容进行换行。我们使用的标签是<br/>

于是我们代码写成了这样：

<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title></title></head><body>夜雨寄北<br/>作者：李商隐<br/>君问归期未有期，巴山夜雨涨秋池。<br/>何当共剪西窗烛，却话巴山夜雨时。<br/></body>
</html>

显示效果如下：

我们在发布文章的时候，需要在视觉上将文章分成几个模块。例如我们要实现下面的效果：

我们就可以在代码中加入hr标签：

<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title></head><body>夜鹰教程网JavaScript视频教程录制完毕<hr/>夜鹰教程网 来源：www.yyjcw.com 日期：2018/1/13 12:52:30<br/>JavaScript是世界上最流行的脚本语言。在Web世界里，只有JavaScript能跨平台、跨浏览器驱动网页，与用户交互。如果你打算做web开发，不管是前端还是后端，javascript都是你必须掌握的技术。本套教程主要讲解了javascript语法基础（变量、数据类型、运算符、流程控制、数组、函数等），javascript BOM和Dom操作、网页中常见的javascript特效案例（下拉菜单、页签、倒计时、loding、随机验证码、数学函数、定时器、延迟执行、表单验证、拖拽原理、对联广告、网页换肤、表格隔行换色、高亮显示、腾讯新闻、发票打印等）。我们精心设计加入的案例功能丰富，内容循序渐进。由于本套教程内容较多、专门为初学者打造，语法部分比较枯燥，如果部分知识你已经会了，我们也建议你全部看完。如果学习过程中遇到问题或者部分功能需要定做，也可以加我们技术QQ：1416 7596 61</body>
</html>

转载于:https://www.cnblogs.com/yyjcw/p/10173025.html

适合0基础的web开发系列教程-换行和水平线相关推荐

适合0基础的web开发系列教程-web 存储
HTML5 web 存储,一个比cookie更好的本地存储方式. 什么是 HTML5 Web 存储? 使用HTML5可以在本地存储用户的浏览数据. 早些时候,本地存储使用的是 cookie.但是Web ...
适合0基础的web开发系列教程-canvas
1.在学习canvas之前,一定要安装一个高级浏览器,推荐最新版本的chrome.因为不是每个版本的浏览器都支持canvas. 2.canvas是用来在网页中绘图的,可以通过javascript程序在 ...
适合0基础的web开发系列教程-文本格式标签汇总
html标签主要是起结构的作用,布局的效果主要靠css完成,比如颜色.背景.字体大小.对齐等. 不过html标签中也有一些常用的文本格式化标签,能对文本内容进行简单的格式设置. 比如加粗文字.定义斜体 ...
【0基础QQ机器人开发】基于go-cqhttp的QQ机器人开发教程,仅供自学
文章目录一.本文目的: 二.实现历程: 三.开发过程 1.准备工作 1.cq-http的下载地址:[Releases · Mrs4s/go-cqhttp (github.com)](https:// ...
Python适合0基础菜鸟学吗
前言经常有小伙伴问:Python适合0基础初学编程的人学吗?今天我们就来从Python的功能和特性方面看一下,Python是否能让新人快速上手. 1.非常适合.我觉得刚开始学编程,负担越少越好,应该 ...
ASP .NET Core Web MVC系列教程：使用ASP .NET Core创建MVC Web应用程序
本系列教程翻译自微软官方教程,官方教程地址:Get started with ASP.NET Core MVC | Microsoft Docs 本系列教程介绍了构建MVC Web应用程序的基础知识. ...
python学全栈还是运维_Python全栈学习——Python基础及Web开发
原标题:Python全栈学习--Python基础及Web开发在DevOps火热的敏捷行业中,无论是开发还是运维都在互联网快速发布下练就了一身的本领,微服务下的敏捷开发体系及智能运维体系都在实战中逐步 ...
C#微信公众号开发系列教程三（消息体签名及加解密）
http://www.cnblogs.com/zskbll/p/4139039.html C#微信公众号开发系列教程一(调试环境部署) C#微信公众号开发系列教程一(调试环境部署续:vs远程调试) C ...
python教程视频-有没有适合零基础小白学的python教程，视频或者书籍都可以?
当你想要自学 python3 编程时,面临的第一个问题是:"我应该看哪些书/教程/视频?"我有一份亲自验证过的极简答案.我刚经过 python3 入门并已开始实战数据分析与爬虫,这 ...

适合0基础的web开发系列教程-换行和水平线

适合0基础的web开发系列教程-换行和水平线相关推荐

最新文章

热门文章