菜单

HTML(二)

2019年5月4日 - 皇家前端

html段落、换行与字符实体

HTML概述和骨干结构

HTML概述和中央构造

学科介绍

前端开荒系统化学习课程,前端开采是后端技术员必修的科目,本学科开展珍重两点:
一、实际付出中要用到的知识
贰、面试中要用到的知识

html段落

<p>标签定义贰个文件段落,3个段落含有暗中同意的前后间距,段落之间会用那种暗中同意间距隔开分离,代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>段落</title>
</head>
<body>
    <p>HTML是 HyperText Mark-up Language 的首字母简写,意思是超文本标记语言,超
    文本指的是超链接,标记指的是标签,是一种用来制作网页的语言,这种语言由一个个的
    标签组成,用这种语言制作的文件保存的是一个文本文件,文件的扩展名为html或者htm。
    </p>

    <p>一个html文件就是一个网页,html文件用编辑器打开显示的是文本,可以用文本的方
    式编辑它,如果用浏览器打开,浏览器会按照标签描述内容将文件渲染成网页,显示的网
    页可以从一个网页链接跳转到另外一个网页。</p>
</body>
</html>

HTML是什么?

HTML是 HyperText Mark-up Language
的首字母简写,意思是超文本标志语言,

style=”font-size: 16px”>超文本指的是超链接,标志指的是标签,是壹种用来成立网页的语言,那种语言由二个个的竹签组成,

style=”font-size: 1陆px”>用那种语言创设的文件保留的是八个文书文件,文件的扩大名称叫html或然htm,

style=”font-size: 1六px”>三个html文件正是二个网页,html文件用编辑器张开展现的是文本,能够用文件的格局编辑它,

style=”font-size: 1陆px”>若是用浏览器打开,浏览器会根据标签描述内容将文件渲染成网页,展现的网页能够从3个网页链接跳转到别的三个网页。

HTML是什么?

HTML是 HyperText 马克-up Language
的首字母简写,意思是超文本标志语言,

style=”font-size: 1陆px”>超文本指的是超链接,标志指的是标签,是一种用来创立网页的语言,这种语言由三个个的竹签组成,

style=”font-size: 1陆px”>用那种语言营造的文件保留的是贰个文书文件,文件的扩大名为html或然htm,

style=”font-size: 1陆px”>三个html文件正是一个网页,html文件用编辑器展开呈现的是文本,能够用文件的点子编辑它,

style=”font-size: 16px”>假设用浏览器展开,浏览器会根据标签描述内容将文件渲染成网页,展现的网页能够从3个网页链接跳转到其它2个网页。

一.一-html概述及html文书档案基本组织

html换行

代码中成段的文字,间接在代码中回车换行,在渲染成网页时候不认那种换行,若是真想换行,能够在代码的段子中插入<br
/>来强制换行,代码如下:

<p>
一个html文件就是一个网页,html文件用编辑器打开显示的是文本,可以用<br />
文本的方式编辑它,如果用浏览器打开,浏览器会按照标签描述内容将文件<br />
渲染成网页,显示的网页可以从一个网页链接跳转到另外一个网页。
</p>

HTML是由:标签和剧情结合

style=”font-size: 1陆px”><title>这是文书档案中的题目</title>

HTML是由:标签和剧情结合

style=”font-size: 1六px”><title>那是文书档案中的标题</title>

html概述

HTML是 HyperText Mark-up Language
的首字母简写,意思是超文本标志语言,超文本指的是超链接,标识指的是标签,是一种用来创造网页的言语,那种语言由一个个的竹签组成,用那种语言塑造的文本保留的是3个文书文件,文件的扩大名称叫html或然htm。

html字符实体

代码中成段的文字,如若文字间想空两个空格,在代码中空三个空格,在渲染成网页时只会展现二个空格,假如想展示多个空格,能够利用空格的字符实体,代码如下:

<!--  在段落前想缩进两个文字的空格,使用空格的字符实体:&nbsp;   -->
<p>
&nbsp;&nbsp;一个html文件就是一个网页,html文件用编辑器打开显示的是文本,可以用<br />
文本的方式编辑它,如果用浏览器打开,浏览器会按照标签描述内容将文件<br />
渲染成网页,显示的网页可以从一个网页链接跳转到另外一个网页。</p>

在网页上出示 “<” 和 “>”
会误以为是标签,想在网页上体现“<”和“>”能够采用它们的字符实体,比方:

<!-- “<” 和 “>” 的字符实体为 &lt; 和 &gt;  -->
<p>
    3 &lt; 5 <br>
    10 &gt; 5
</p>

HTML标签(标记)的语法:

标签是由”<“和”>”括起来

style=”font-size: 16px”>双标签:<标签名>….</标签名>

单标签:<标签名/>

HTML标签(标记)的语法:

标签是由”<“和”>”括起来

style=”font-size: 16px”>双标签:<标签名>….</标签名>

单标签:<标签名/>

html文书档案基本结构

二个html的着力构造如下:

<!DOCTYPE html>
<html>
    <head>            
        <meta charset="UTF-8">
        <title>网页标题</title>
    </head>
    <body>
          网页显示内容
    </body>
</html>

 

率先行是文书档案注明,第叁行“<html>”标签和末段1行“</html>”定义html文书档案的一体化,“<head>”标签和“<body>”标签是它的首先层子成分,“<head>”标签里面负担对网页进行一些安装以及定义标题,设置总结定义网页的编码格式,外链css样式文件和javascript文件等,设置的内容不会显得在网页上,标题的故事情节会显示在标题栏,“<body>”内编写制定网页上显得的剧情。

三个html文件就是一个网页,html文件用编辑器张开显示的是文件,能够用文件的艺术编辑它,如果用浏览器展开,浏览器会遵照标签描述内容将文件渲染成网页。

html块、含样式的竹签

HTML基本构造

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>网页标题</title>
</head>
<body>
    网页显示内容
</body>
</html>

HTML基本构造

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>网页标题</title>
</head>
<body>
    网页显示内容
</body>
</html>

html文书档案火速创造

新建3个html文档后,能够用急速键的措施快捷成立html文书档案。飞快键:!+tab键,或者
html:5+tab键

html块

1、div标签 块成分,表示1块内容,未有切实可行的语义。
二、span标签 行内成分,表示一行中的一小段内容,未有具体的语义。

html文书档案标准

style=”font-size: 1陆px”>xhtml制定了文档的编辑标准,html五可有的依照,也可全方位遵守,看支出须求。

一、全体的价签必须小写

二、全部的质量必须用双引号括起来

叁、全部标签必须关闭

style=”font-size: 1六px”>四、img必须要加alt属性(对图纸的叙说)

html文书档案标准

style=”font-size: 1陆px”>xhtml制定了文书档案的编辑标准,html伍可有的遵照,也可方方面面服从,看支出供给。

一、全体的价签必须小写

2、全部的品质必须用双引号括起来

三、全部标签必须关闭

style=”font-size: 16px”>四、img必需要加alt属性(对图纸的描述)

一.二-html标签入门

含样式和语义的价签

一、em标签 行内成分,表示作品中的重申词
2、i标签 行内成分,原本从不语义,w三c强加了语义,表示行业内部词汇
三、b标签
行内成分,原本从不语义,w三c强加了语义,表示文书档案中的关键字依旧产品名
四、strong标签 行内元素,表示卓殊重大的始末

html注释:

style=”font-size: 一5px”>html文书档案代码中得以插入注释,注释是对代码的印证和释疑,注释的始末不会呈现在页面上,html代码中插入注释的主意是:

<!-- 这是一段注释  -->

html注释:

style=”font-size: 15px”>html文书档案代码中能够插入注释,注释是对代码的认证和分解,注释的内容不会显得在页面上,html代码中插入注释的章程是:

<!-- 这是一段注释  -->

标签语法:

学习html语言就是上学标签的用法,html常用的价签有20三个,学会那些标签的选拔,就多数学会了HTML的使用。

语义化的价签

语义化的标签,就是在布局的时候多应用语义化的竹签,寻找引擎在爬网的时候能认得这几个标签,精通文书档案的结构,方便网址的选定。比方:h一标签是表示标题,p标签是表示段落,ul、li标签是代表列表,a标签表示链接,dl、dt、dd表示定义列表等,语义化的竹签不多。

 

HTML中Head头

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>网页标题</title>
</head>
<body>
    网页显示内容
</body>
</html>

style=”font-size: 一伍px”>HEAD标签里面负担对网页实香港行政局地装置以及定义标题,

style=”font-size: 一五px”>设置总括定义网页的编码格式,外链css样式文件和javascript文件等,

style=”font-size: 一伍px”>设置的内容不会来得在网页上,题目的始末会议及展览示在标题栏

设置网页编码:<meta charset="utf-8"/>
关键字:<meta name="Keywords" content="关键字" />
描述:  <meta name="Description" content="简介、描述" />
网页标题:<title>本网页标题</title>
导入CSS文件:<link type="text/css" rel="stylesheet" href="**.css"/>
CSS代码:<style type="text/css">嵌入css样式代码</style>
JS文件或代码: <script >。。。</script>

HTML中Head头

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>网页标题</title>
</head>
<body>
    网页显示内容
</body>
</html>

style=”font-size: 15px”>HEAD标签里面担任对网页进行部分安装以及定义标题,

style=”font-size: 1伍px”>设置囊括定义网页的编码格式,外链css样式文件和javascript文件等,

style=”font-size: 一5px”>设置的始末不会展现在网页上,题目的剧情会来得在标题栏

设置网页编码:<meta charset="utf-8"/>
关键字:<meta name="Keywords" content="关键字" />
描述:  <meta name="Description" content="简介、描述" />
网页标题:<title>本网页标题</title>
导入CSS文件:<link type="text/css" rel="stylesheet" href="**.css"/>
CSS代码:<style type="text/css">嵌入css样式代码</style>
JS文件或代码: <script >。。。</script>

标签的的利用形式:

<!-- 1、成对出现的标签:-->

<h1>h1标题</h1>
<div>这是一个div标签</div>
<p>这个一个段落标签</p>


<!-- 2、单个出现的标签: -->
<br>
<img src="images/pic.jpg" alt="图片">

<!-- 3、带属性的标签,如src、alt 和 href等都是属性 -->
<img src="images/pic.jpg" alt="图片">
<a href="http://www.baidu.com">百度网</a>

<!-- 4、标签的嵌套 -->
<div>
    <img src="images/pic.jpg" alt="图片">
    <a href="http://www.baidu.com">百度网</a>
</div>

 

HTML标题

通过
<h一>、<h二>、<h三>、<h四>、<h5>、<h六>,标签能够在网页上定义6种等第的标题。

style=”font-size: 一五px”>种种级其他标题表示文书档案的陆级目录层级关系,比方说:
<h1>用作主题目(最要害的),其后是
<h二>(次首要的),

再其次是
<h3>,就那样推算。搜索引擎会使用标题将网页的结会谈情节编排索引,所以网页上选用标题是很关键的。

<h1>这是一级标题</h1>
<h2>这是二级标题</h2>
<h3>这是三级标题</h3>

HTML标题

经过
<h一>、<h贰>、<h三>、<h四>、<h5>、<h陆>,标签能够在网页上定义六种级其他标题。

style=”font-size: 15px”>陆种等第的标题表示文书档案的陆级目录层级关系,比如说:
<h1>用作主标题(最关键的),其后是
<h2>(次首要的),

再其次是
<h3>,就那样推算。寻觅引擎会选拔标题将网页的构造和剧情编排索引,所以网页上使用标题是很主要的。

<h1>这是一级标题</h1>
<h2>这是二级标题</h2>
<h3>这是三级标题</h3>

块成分标签(行成分)和内联成分标签(行内成分)

标签在页面上会展现成一个4方。除了出示成方块,它们一般分为上边两类:
块成分:在布局中默许会独占1行,块成分后的成分需换行排列,块成分暗中认可宽度等于父成分的涨幅,纵然设置了非常大幅,也并吞壹行。
内联元素:成分之间能够排列在一行,设置宽高无效,它的宽高由内容撑开,内联成分之间默许会有小间隔。

HTML段落,换行,字符实体

HTML段落,换行,字符实体

常用块成分标签

相关文章

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图