初步认识CSS

来源：互联网发布：手机视频软件编辑：程序博客网时间：2024/05/16 07:55

CSS基础知识

1.1基本概念

CSS是指层叠样式表(CascadingStyle Sheets);

那么，为什么需要用CSS呢？

HTML描述了要呈现的内容，而CSS则定义了这些内容的呈现形式，比如字体、颜色等。使CSS能够将页面内容和呈现形式有效分离，有利于分工合作，也有利于快速更换不同的呈现形式。

使用样式表可以有三种方式:

(1) 内联样式

<p style="font-size:24px;color:blue">内联样式的演示</p>

将样式定义在style属性中，内容和表现形式高度耦合，维护困难，不利于分工合作

这样不利于分工合作，不提倡使用

(2) 内部样式

<head>
    <meta http-equiv="Content-Type"content="text/html; charset=utf-8"/>
    <title>CSS样式</title>
    <style type="text/css">
        p{
            font-size:36px;
            color:red;
        }
    </style>
</head>
<body>
<p style="font-size:24px;color:blue">内联样式的演示</p>
<p>内部样式演示1</p>
<p>内部样式演示2</p>
</body>

在<head>标签中通过<style>标签来定义

内容和表现形式的耦合程度降低了，但都还是在html文件中，没有实现完全分离。

定义的样式只能在当前页面中使用.

(3) 外部样式表

首先需要

/*只应用于段落的样式*/
p{
font-size: 36px;
color: blue;
}

css中也可以使用注释，形式为/*...*/

然后在需要使用这些样式的html文件中引入该样式表文件

外部样式表使得内容和表现形式彻底分离，有利于分工合作及维护。可在多个html中引用。

推荐尽量使用外部样式。

阅读全文

0 0