范仁义html+css课程---2、html常用标签

一、总结

一句话总结:

html常用的标签有 标题标签、div、span、p、hr、br标签 等

1、html中的标题标签有哪些?

<h1></h1>...<h6></h6>

2、html文件中最常见的两个标签div标签和span标签分别是干嘛的?

<div></div>:区块标签:分块和设置样式
<span></sapn>:文本标签:设置样式

3、自结束标签 hr标签 和 br标签 分别是做什么的?

<hr />:水平线
<br />:换行

4、块标签中的 p标签 的作用是什么?

<p></p>:段落标签:表示一个段落

二、html常用标签

课程对应的视频地址:2、html基本标签
https://www.fanrenyi.com/video/2/7

1、相关知识

a、块标签:

标题标签<h1></h1>...<h6></h6>

水平线<hr />

换行<br/>

段落<p></p>

区块标签<div></div>

b、行标签:

文本标签<span></sapn>

c、注意:

1、标签小写,

2、要注意闭合标签

3、标签可以嵌套但是不能交叉嵌套

2、代码

 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>html常用标签小实例</title>
</head>
<body>
<div>
<h1>我与学习的二三事</h1>
<hr>
<br> <div style="color: red;">
<h2>为什么在义务教育的应试阶段,很多人如此惧怕 <span style="color: coral;">数学</span> ?</h2>
<p> <span style="font-weight: 600;">节点断档</span>:因为你错过了关键节点,套用文艺的说话来说:那天天很蓝,风在吹,所有人都以为那是一个普通的一天——可是之后上课却开始一头雾水<br><br></p>
</div> <div>
<h2>知识体系化的意义是什么</h2>
<p>
不是一蹴而就:只要有一点门槛的知识都是体系化的。所谓体系化的意思是,你学习的路径绝对不是一蹴而就的,而是:要达到C点,首先你必须学会B,要达到E点,你必须先达到D。你根本无法给一个小学三年级的孩子讲什么叫微积分,你甚至无法给一个只学过九九乘法表的小学生演算二位数乘除,更不用说分数加减乘除了。<br><br>
打通所有知识关键点:就算那个小学生懂得微积分(也就是那个P点)而被称为神童,他也是打通了从A至P的所有关键知识节点而掌握的。<br><br>
</p>
</div> <div>
<h2>为什么 知乎、B站、微博、抖音等平台里面的零散知识点作用不大?</h2>
<p>
1、知识未成体系:知识点很零散,吸收效果很差,强度也很差<br><br>
2、你的知识结构未成体系,导致学习效率低,容易忘记<br><br>
</p>
</div> <div>
<h2>如何做到正向激励并逼迫你去学习?</h2>
<p>
1、激励奖励:寻找正向激励的奖励——小到在知乎撰写的回答有人点赞、ID粉丝关注,大到考入名校和拿到只有10%-20%的技能证书,或者利用专业知识水平进入一家公司,要知道这些东西是带不走的,他们将成为“资历”一辈子给你一个“我能比别人学得好”的暗示。”只有成就才是学习的最佳诱惑,我们最终寻找的是终生式的正向激励。<br><br>
2、体系知识+500小时:订立一个需要体系化的知识,做好投入500-800小时的目标,尽力让自己的日有效时间从4小时开始起步。这意味着你将建立时间观念,知道自己时间的价值,不至于花在游戏时间和社交时间太多。要知道越是把时间花在自己根本感受不到价值的东西上面,你的有效时间越低,效率越低。而一个好消息是,你的竞争对手花在学习上的日有效时间远远低于4个小时。高效学习者最在意的是时间的价值。<br><br>
3、体系目标:建立一个体系化的目标,并且明确知道关键时点在哪里。这意味着你需要把目标解剖到具体的关键节点上,并且按照步骤一步一步完成。如果没有体系化的计划和执行,就意味着完不成体系化的知识。<br><br>
4、意志力:训练你的意志力,这是学习者之间差距的最大动因,因为它同时影响了时间、效率两大因素。要注意意志力是有限的,注意不断提高它,并花在重要的地方。<br><br>
</p>
</div>
</div> </body>
</html>

三、参考资料

1、div定义和用法

<div> 可定义文档中的分区或节(division/section)。

<div> 标签可以把文档分割为独立的、不同的部分。它可以用作严格的组织工具,并且不使用任何格式与其关联。

如果用 id 或 class 来标记 <div>,那么该标签的作用会变得更加有效。

用法

<div> 是一个块级元素。这意味着它的内容自动地开始一个新行。实际上,换行是 <div> 固有的唯一格式表现。可以通过 <div> 的 class 或 id 应用额外的样式。

不必为每一个 <div> 都加上类或 id,虽然这样做也有一定的好处。

可以对同一个 <div> 元素应用 class 或 id 属性,但是更常见的情况是只应用其中一种。这两者的主要差异是,class 用于元素组(类似的元素,或者可以理解为某一类元素),而 id 用于标识单独的唯一的元素。

2、span标签的定义和用法

<span> 用于对文档中的行内元素进行组合。

<span> 标签没有固定的格式表现。当对它应用样式时,它才会产生视觉上的变化。如果不对 <span> 应用样式,那么 <span> 元素中的文本与其他文本不会任何视觉上的差异。

<span> 标签提供了一种将文本的一部分或者文档的一部分独立出来的方式。

提示:可以使用 <span> 来组合行内元素,以便通过样式来格式化它们。

例如:

<p>我的母亲有 <span style="color:blue;font-weight:bold">蓝色</span> 的眼睛,我的父亲有 <span style="color:darkolivegreen;font-weight:bold">碧绿色</span> 的眼睛。</p>

 

范仁义html+css课程---2、html常用标签的更多相关文章

  1. 范仁义html+css课程---10、其它标签

    范仁义html+css课程---10.其它标签 一.总结 一句话总结: 了解iframe.Figure与Figcaption.address.progress.meter.datalist.field ...

  2. 范仁义html+css课程---11、html补充知识

    范仁义html+css课程---11.html补充知识 一.总结 一句话总结: 小于号(<):< 大于号(>):> 空格:  二.html 字符实体 1.小于号(<)和大 ...

  3. 范仁义html+css课程---7、表单

    范仁义html+css课程---7.表单 一.总结 一句话总结: 表单标签的话主要掌握form标签.input标签(以及input标签的不同的type值).select标签.textarea等标签,及 ...

  4. 范仁义html+css课程---6、表格

    范仁义html+css课程---6.表格 一.总结 一句话总结: 表格中最常用的元素就是table.tr.td.th,还有语义化的thead.tbody.tfoot标签 1.表格构成三个基本要素? t ...

  5. 范仁义html+css课程---5、列表

    范仁义html+css课程---5.列表 一.总结 一句话总结: 学会基本的使用有序列表.无序列表.定义列表,设置样式的话尽量通过css而不是属性 1.无序列表基本形式(实例)? ul标签包裹li标签 ...

  6. 范仁义html+css课程---3、图片和超链接

    范仁义html+css课程---3.图片和超链接 一.总结 一句话总结: img标签是图片标签,定义 HTML 页面中的图像 a标签是超链接标签,用于从一个页面链接到另一个页面. 1.img标签要点? ...

  7. 范仁义html+css课程---9、video、audio、canvas和svg元素略讲

    范仁义html+css课程---9.video.audio.canvas和svg元素略讲 一.总结 一句话总结: video:HTML5视频标签. audio:html5音频标签. canvas:绘制 ...

  8. 范仁义html+css课程---8、新元素布局

    范仁义html+css课程---8.新元素布局 一.总结 一句话总结: 推荐用新标签(语义化的标签)来布局:header(头部),footer(尾部),aside(侧边栏),nav(导航),artic ...

  9. 范仁义html+css课程---4、文本标签

    范仁义html+css课程---4.文本标签 一.总结 一句话总结: 文本标签大致掌握一下,做到它站在你对面的时候最好认得,认不得也没关系,直接百度 1.ins标签.u标签和del标签 作用? ins ...

随机推荐

  1. ..\USER\stm32f10x.h(428): error: #67: expected a "}" ADC1_2_IRQn = 18, /*!

    MDK软件编译,出现如下错误: ..\USER\stm32f10x.h(428): error: #67: expected a "}" ADC1_2_IRQn = 18, /*! ...

  2. mysql 的使用

    1. 安装 https://dev.mysql.com/downloads/mysql/ 2. 配置 $ vim ~/.bash_profile $ export PATH=$PATH:/usr/lo ...

  3. Winform开发1

    VS的Winform开发中,TextBox可能拖过来的时候不能改变其高度,这就要在其属性Multiline为True.

  4. git提交代码并将develop分支合并到master分支上

    提交合并代码流程: git add .git commit -m ''git pushgit checkout mastergit merge develop //将develop 分支与master ...

  5. php验证码案例

    <?php header('Content-type:image/jpeg'); $img=imagecreatetruecolor(120,40); // 背景颜色 $bg_color=ima ...

  6. HBase集群环境搭建v1.0

    本文档环境基于ubuntu14.04版本,如果最终不使用SuperMap iServer 9D ,可以不配置geomesa-hbase_2.11-2.0.1-bin.tar.gz (转发请注明出处:h ...

  7. ViewBag---MVC3中 ViewBag、ViewData和TempData的使用和差别-------与ViewBag+Hashtable应用例子

    ViewBag 在MVC3開始.视图数据能够通过ViewBag属性訪问.在MVC2中则是使用ViewData.MVC3中保留了ViewData的使用.ViewBag 是动态类型(dynamic),Vi ...

  8. docker镜像批量打包

    docker镜像批量打包 批量打包镜像: # docker save $(docker images | grep -v REPOSITORY | awk 'BEGIN{OFS=":&quo ...

  9. 2013.4.19 - KDD第一天

    其实昨天KDD就开始了,不过今天算是我跟KDD的第一天.   昨天夜里就短信跟中秋聊了一会儿,然后中秋说他一天都在弄数据库,连不上怒了.然后我跟他说明天我来.于是今天就在图书馆弄KDD,数据是用数据库 ...

  10. tornado项目工程

    项目模块基本架构如下: -------------application.py import tornado.web from views import index, login import con ...