您的位置：首页 > Web前端 > CSS

初步认识CSS

2017-07-25 19:31 225 查看

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文件中引入该样式表文件

<head>

    <meta http-equiv="Content-Type"content="text/html; charset=utf-8"/>

    <title></title>

    <link type="text/css" rel="stylesheet"href="css/E101-01-01.css"/>
</head>

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

推荐尽量使用外部样式。

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航