HTML/CSS学习疑惑

关于引用。<q> </q> 和 <blockquote> </blockquote>

<q>用于简单的行内引用，在被引用的内容两边加上双引号。而<blockquote>将引用内容从周围内容中分离出来。

代码如下

<!doctype html>
<html>

<head>
    <meta charset="uft-8">
    <title>超文本标记语言</title>
</head>
<body>
            <p><q>超级文本标记语言</q>是标准通用标记语言下的一个应用，也是一种规范，一种标准，<blockquote>它通过标记符号来标记要显示的网页中的各

            个部分。网页文件本身是一种文本文件，通过在文本文件中添加标记符，可以告诉浏览器如何显示其中的内容</blockquote>（如：文字如何处理，画面

             如何安排，图片如何显示等）。</p>
</body>
</html>

显示结果如下：

”超级文本标记语言“是标准通用标记语言下的一个应用，也是一种规范，一种标准，

它通过标记符号来标记要显示的网页中的各 个部分。网页文件本身是一种文本文件，通过在文本文件中添加标记符，可以告诉浏览器如何显示其中的内容

（如：文字如何处理，画面 如何安排，图片如何显示等）。

盒模型

每一个盒模型都由内容区（content），内边距（padding），边框（border），外边距（margin）组成。

margin在设置时，可以分别使用

margin-top :10px;
margin-bottom :10px;
margin-left :20px;
margin-right :30px;

也可以

margin:10px 30px 10px 20px;

对应顺序为上，右，下，左。

关于内联元素和块元素

html中的各种元素/标签，可以分为两大类。一类为内联元素，一类为块元素。

块元素的特点：总是另起一行开始；高度，行高以及顶、底边距都可控制；

内联元素的特点：内联元素和其他元素都在一行上，并且高度，行高以及顶，底边距不可改变；

比较常见的内联元素就是<img>元素。

<div>和<span>的区别

<div>为块级元素，而<span>为内联元素。

<!doctype html>
<html>

<head>
    <meta charset="uft-8">
    <title>超文本标记语言</title>
</head>

<body>
    <div>div1</div>
    <div>div2</div>
    <span>span3</span>
    <span>span4</span>
</body>

</html>

运行结果为

div1
div2
span3 span4