Java学习阶段一:2.CSS

目录

了解CSS

五大CSS选择器

CSS导入方式

 

了解CSS

CSS 概述

  • CSS 指层叠样式表 (Cascading Style Sheets)
  • 样式定义如何显示 HTML 元素
  • 样式通常存储在样式表
  • 把样式添加到 HTML 4.0 中,是为了解决内容与表现分离的问题
  • 外部样式表可以极大提高工作效率
  • 外部样式表通常存储在 CSS 文件
  • 多个样式定义可层叠为一

参考地址:http://www.w3school.com.cn/css/css_jianjie.asp

五大CSS选择器

一、标签选择器:

标签选择器是直接将HTML标签作为选择器,可以是p、h1、strong、dl等HTML标签。

二、id选择器:

每一个标签他都有一个共同属性id,所以我们通常给页面元素定义id。

三、类(class)选择器:

每一个标签同样都有一个类属性,所以在CSS里用一个点开头表示类别选择器定义。

四、群组选择器:

当几个元素样式属性一样时,可以共同调用一个声明,元素之间用逗号分隔。

五、后代选择器:

后代选择器也称作为派生选择器,通过依据元素在其位置的上下文关系来定义样式,你可以使标记更加简洁。 

参考地址:https://blog.csdn.net/baihuaxiu123/article/details/51327025

CSS导入方式

参考地址:https://blog.csdn.net/u011456552/article/details/70169789

一、行内方式

<div style="background-color: blue"></div>

二、内嵌方式

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        .style{
            width: 100px;
            height: 100px;
            border: 5px solid blue;
        }
    </style>
</head>
<body>
    <div class="style"></div>
</body>
</html>

三、链接方式

<head> <link href="style.css" rel="stylesheet" /> </head>

四、导入方式(不建议使用直接在html中使用)

<style>
    @import url(style.css);
</style>

 

猜你喜欢

转载自blog.csdn.net/bzc1452377896/article/details/83097691