本章通过实例向您演示最常用的 HTML 标签。

提示：不要担心本章中您还没有学过的例子，您将在下面的章节中学到它们。

提示：学习 HTML 最好的方式就是边学边做实验。我们为您准备了很好的 HTML 编辑器。使用这个编辑器，您可以任意编辑一段 HTML 源码，然后单击 TIY 按钮来查看结果。

HTML 标题

HTML 标题（Heading）是通过 <h1> - <h6> 等标签进行定义的。

代码：

<html>

<body>

<h1>This is heading 1</h1>

<h2>This is heading 2</h2>

<h3>This is heading 3</h3>

<h4>This is heading 4</h4>

<h5>This is heading 5</h5>

<h6>This is heading 6</h6>

<p>请仅仅把标题标签用于标题文本。不要仅仅为了产生粗体文本而使用它们。请使用其它标签或 CSS 代替。</p>

</body>

</html>

效果演示：

HTML 段落

HTML 段落是通过 <p> 标签进行定义的。

<html>

<body>

<p>(*^__^*) 嘻嘻……，我是段落1。</p>

<p>╭(╯^╰)╮，我是段落2。</p>

<p>(╯‵□′)╯︵┻━┻，本段落岂是尔等可以看见的。</p>

<p>段落元素由 p 标签定义。</p> 

</body>

</html>

演示效果：

HTML 链接

HTML 链接是通过 <a> 标签进行定义的。

<html>

<body>

<a href="http://www.w3school.com.cn">

This is a link</a>

<p></p>

 <!因为不知道用什么换行，所以尝试了用添加一个空的段落，这就相当于换行了。而且很显然，我也不知道肿么去注释。。。(在学弟和度娘的帮助下，才知道的)>

<p></p>

<a href="https://www.luogu.org/problemnew/show/1454">

这是我的做的题目。</a>

<br><!后来才发现可以用br来实现换行>

<p>这是换行</p>

</body>

</html>

效果演示：

注释：在 href 属性中指定链接的地址。

（您将在本教程稍后的章节中学习更多有关属性的知识）。

HTML 图像

HTML 图像是通过 <img> 标签进行定义的。

<html>

<body>

<img src="/i/eg_w3school.gif" width="300" height="120" />

<br>

<img src="http://images.cnblogs.com/cnblogs_com/cangT-Tlan/1099682/o_%e5%a4%b4%e5%83%8f2.jpg" width="100" height="120" />

<br>

<img src="http://images.cnblogs.com/cnblogs_com/cangT-Tlan/943345/o_20150423160900_86322.jpg" width="300" height="200" />

<! width用来图片调节宽度，height用来调节图片的高度>

</body>

</html>

效果演示：

注释：图像的名称和尺寸是以属性的形式提供的。

学习内容转自：http://www.w3school.com.cn/html/html_basic.asp

HTML学习----------DAY1 第三节的更多相关文章

  1. 风炫安全WEB安全学习第二十三节课 利用XSS获取COOKIE

    风炫安全WEB安全学习第二十三节课 利用XSS获取COOKIE XSS如何利用 获取COOKIE 我们使用pikachu写的pkxss后台 使用方法: <img src="http:/ ...

  2. Python学习-day1

    Mark一下,python学习. 今天一天已1.5x的速度看完了Alex老师的第一周的视频,先是4节鸡汤课,而且给了勺,讲述了python目前在世界的地位,发展趋势,以及未来的愿景. 最重要的还是写一 ...

  3. python学习——DAY1

    日期:20170113 一.个人体会: 零基础学python,是艰辛的,需要付出和坚持. 关于流程图.我最开始画的是从上到下,再从左到右,画了很多重复的内容,单线程的流程图,看起来很容易理解,但是自己 ...

  4. python全栈学习--day1

      计算机基础 CPU:中央处理器 内存:4GB,8GB,临时处理事务的地方,供给CPU数据. 硬盘:相当于电脑的数据库,存储着大量的数据,文件,电影等. 操作系统:执行者,支配所有关系 window ...

  5. [struts2学习笔记] 第三节 创建struts 2 HelloWorld所需的六个步骤

    本文地址:http://blog.csdn.net/sushengmiyan/article/details/40349201 官方文档:http://struts.apache.org/releas ...

  6. python学习Day1 计算机原理编程思维

    一.学习思想:3W+1H   学什么(what).为什么学(why).用在哪里(where).怎么用(how) 学习编程语言重在代码量.代码量.代码量! 二.计算机五大组成部分,三大核心: 五大组成部 ...

  7. Python爬虫学习 - day1 - 爬取图片

    利用Python完成简单的图片爬取 最近学习到了爬虫,瞬时觉得很高大上,想取什么就取什么,感觉要上天.这里分享一个简单的爬取汽车之家文章列表的图片教程,供大家学习. 需要的知识点储备 本次爬虫脚本依赖 ...

  8. 算法学习--Day1

    为了冲刺研究生初试,我准备在课余时间捡起往日的算法.多多练习算法题目,提前准备算法的机试. 今天是4月14日,距离算法考试还有两个月的时间吧,这两个月的所学所得我就都记录在这里了.不仅仅包括算法的准备 ...

  9. HTML学习----------DAY1 第二节

    使用 Notepad 或 TextEdit 来编写 HTML 可以使用专业的 HTML 编辑器来编辑 HTML: Adobe Dreamweaver Microsoft Expression Web ...

随机推荐

  1. ZBrush中常用3D笔触效果

    3D笔触共有6种绘制方式,分别为Dots(点).Drag Rect(拖拉矩形).Freehand(徒手绘制).Color Spray(彩色喷溅).Spray(喷溅)和Drag Dot(拖拽斑点). 1 ...

  2. BZOJ3796 Mushroom追妹纸（二分答案+后缀数组+KMP）

    求出一个串使得这个串是\(s1,s2\)的子串.串中不包含\(s3\). 如果没有这个\(s3\)就可以二分答案,然后height小于二分值分一组.看看每组里是不是出现过\(s1,s2\)的后缀.判断 ...

  3. java 模拟ajax上传图片

    1.maven 引入依赖 <!-- https://mvnrepository.com/artifact/org.apache.httpcomponents/httpmime --> &l ...

  4. JDBC读写MySQL的大字段数据

    JDBC读写MySQL的大字段数据   不管你是新手还是老手,大字段数据的操作常常令你感到很头痛.因为大字段有些特殊,不同数据库处理的方式不一样,大字段的操作常常是以流的方式 来处理的.而非一般的字段 ...

  5. 紫书 习题 11-12 UVa 1665 （并查集维护联通分量）

    这道题要逆向思维 反过来从大到小枚举, 就是在矩阵中一点一点加进去数字,这样比较 好操作, 如果正着做就要一点一点删除数字, 不好做. 我们需要在这个过程中维护联通块的个数, 这里用到了并查集. 首先 ...

  6. 【BZOJ 1150】[CTSC2007]数据备份Backup

    [链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 选择的连接肯定是相邻的点对. 那么我们处理出来长度为n-1的数组a 其中a[i-1] = dis[i]-dis[i-1] 那么问题就 ...

  7. linux 安装 redis3.0

    下载 解压 进入目录 编译 $ wget http://download.redis.io/releases/redis-3.2.0.tar.gz $ tar xzf redis-3.0.0.tar. ...

  8. WIZnet相关产品介绍

    WIZnet  自1998年在韩国创立以来,一致专注研发全硬件TCP/IP协议栈芯片.同一时候开发设计相关网络模块和无线产品,同一时候 WIZnet 鼓舞开源硬件.相关开源硬件产品也已层出不断. 主要 ...

  9. springboot Ehcache缓存配置

    例牌的导包 <!-- 包含支持UI模版(Velocity,FreeMarker,JasperReports), 邮件服务, 脚本服务(JRuby), 缓存Cache(EHCache), 任务计划 ...

  10. AngularJs轻松入门（六）表单校验

    表单数据的校验对于提高WEB安全性意义不大,因为服务器接收到的请求不一定来自我们的前端页面,有可能来自别的站点,黑客可以自己做一个表单,把数据提交到我们的服务器(即跨站伪造请求),这样就绕过了前端页面 ...