Html和Css学习笔记-html基础知识

此篇博客是个人复习笔记，html和css学的时间过久了，忘得差很少了，最近要使用一下，因此从新打开html的书略读，后记录了标签，元素，属性的具体意义。css

这里所介绍的html和css的版本为html5与css3html

Html是超文本标记语言（英语全称：HyperText Markup Language，简称：HTML）是一种用于建立网页的标准标记语言html5

Css是层叠样式表(英文全称：Cascading Style Sheets)是一种用来html和xml等文件样式的计算机语言，CSS不只能够静态地修饰网页，还能够配合各类脚本语言动态地对网页各元素进行格式化。css3

Html和Css验证工具的地址：http://validator.w3.org/浏览器

一.基础内容：

标记=开始标记+内容+结束标记框架

标记能够嵌套使用，例如：页面主体标记中含有标题标记，段落标记。工具

有些标记有属性，具体格式，以a标记为例，<a make="xxxx">xxxx</a>其中make为标记的属性。字体

设计为没有任何内容的元素称为void元素，须要使用void元素时，只须要使用一个开始标记，这是一种方便的简写，能够减小html中的标记数量编码

二.经常使用标记的使用与意义：

<!doctype html>html5的文档类型定义，这一行要写到html文件开头url

<html></html>标记html页面的开始和结束

<head></head>标记页面的有关信息

<title></title>为页面指定一个标题，标记中的内容出如今浏览器的顶部

<body></body>标记页面的主体内容

中间xxx的内容为注释的内容

编写html时要把首部和页面主体分开

<h1></h1>为主标题，从<h2>到<h6>依次为副标题，字体由大到小

<p></p>开始一个段落

<blockquote> </blockquote> 标签订义块引用，之间的全部文本都会从常规文本中分离出来，常常会在左、右两边进行缩进（增长外边距），并且有时会使用斜体。也就是说，块引用拥有它们本身的空间

<br>插入一个换行符

<q> 标签订义一个短的引用，浏览器常常会在这种引用的周围插入引号

须要了解的内容（一些老版本弃置的元素与不建议使用的元素，作到看见了要明白其含义）

<ol></ol>定义一个有序列表

<ul> 标签订义无序列表

<li> 标签订义列表项目，<li> 标签可用在有序列表 (<ol>) 和无序列表 (<ul>) 中

<dl> 标签订义一个描述列表，<dl> 标签与 <dt>（定义项目/名字）和 <dd>（描述每个项目/名字）一块儿使用

<em></em>标签告诉浏览器把其中的文本表示为强调的内容，对于全部浏览器来讲，这意味着要把这段文字用斜体来显示

<body bgcolor="xxx" text="xxxx">,bgcolor属性设置页面颜色，text属性设置文本颜色

<font face="arial">xxxx</font>利用font元素改变字体

<center></center>对其包围的文本进行水平居中处理

一些字符实体

&lt显示为<

&gt显示为>

&copyright显示为©

三.一个简单的html框架

<!--这是仁人用于博客中的演示文本，写于2019年03月04日-->
<!doctype html>
<html>
    <head>
         <meta charset="utf-8">  
        <title>Hello Wrld!</title>
    </head>
    <body>
        <h1>演示文件，页面显示hello world！</h1>
        <p> Hello Wrld ! </p>
    </body>
</html>

四.在页面中插入一个连接

<a></a>用于建立指向其它页面的连接，元素中的内容就是连接文本，在浏览器中连接文本会显示有下划线，指示这是可单击的，例如：

<a href="(连接目标文件的路径或url)" 　　title="文本描述">（连接文本）</a>

href属性指向连接文件的路径

rirle属性所需连接页面的文本描述

加入id属性用于具体指向某个连接的某个标题，例如：

<a href="index.html#标识符">xxxxx</a> 并同步页面中的标题,连接所使用的标识符要与标题的标识符设置一致 <h2 id="标识符">xxxxx</h2>

加入target属性，使浏览器打开连接时为单独的窗口，而不是同一窗口，例如：

<a target="_blank" href="xxxxxxxx" title="xxxxxxxxx">xxxxxxxxx</a>

若是不加入target属性，点击连接时浏览器会在同一窗口打开连接，加入此属性，浏览器会在单独窗口打开连接

五.在页面中插入图像

<img src="xxxxx">标记为在页面中显示图像，xxx为图片的路径或url

alt=“xxx”属性为描述这个图像内容的文本，若是图像未能显示，就会使用这个文原本取代它。

width-"xxx"属性告诉浏览器在页面中显示图像的宽度

height="xxx"属性告诉浏览器在页面中显示图像的高度