zoukankan      html  css  js  c++  java
  • CSS简介

    一:CSS概述

    (1)CSS是指层叠样式表,这些样式定义如何显示HTML元素。这是由于如果是一个大型的网页,所有代码都写在一个HTML文件里面的话,会很不容易管理,同时代码的简洁度也不够,所以讲HTML文件内相同的样式提取出来,写到专门的CSS文件内,在通过引用的方式得以展现,大大提高了代码的复用率,提高了整体开发的效率。

    (2)CSS语言的特点主要有这几个特点,丰富的样式定义,CSS提供了丰富的文档样式外观;易于使用和修改,CSS可以将样式定义在HTML元素的style属性中,也可以定义在HTML文档的header部分,还可以定义在专门的CSS文件中,供HTML文件引用。修改是只需要修改定义的那部分代码,不需要修改所以使用这个样式的标签。易于管理,CSS可以将相同样式的元素进行归类,使用同一个样式进行定义,也可以将某个样式应用到所有同名的HTML标签中,也可以将一个CSS样式指定到某个页面元素中。如果要修改样式,我们只需要在样式列表中找到相应的样式声明进行修改。多页面应用,CSS样式可以供任何页面文件都可以将其引用。页面压缩,样式声明在CSS样式表中,可以大大的减少HTML页面的内容,减少页面加载的时间。

    二:多重样式层叠为一个

    样式表允许以多种方式规定样式信息。样式可以规定在单个的 HTML 元素中,在 HTML 页的头元素中,或在一个外部的 CSS 文件中。甚至可以在同一个 HTML 文档内部引用多个外部样式表。

    主要有三种样式表:外部样式表、内部样式表、内嵌样式表,其中,内嵌样式表拥有最高的优先权

    1、内嵌样式
    内嵌样式是把css的代码嵌入到html标签中
    <div style="color:red;font-size: 100px;">你好啊 小朋友</div>
    语法:
    (1)使用style属性将样式嵌入到html标签中
    (2)属性的写法:属性:属性值
    (3)多个属性之间使用分号;隔开

    2、内部样式
    在head标签中使用style标签进行css的引入
    <style type="text/css">
    div{color:red;font-size: 100px;}
    </style>
    语法:
    (1)使用style标签进行css的引入
    <style type="text/css">
    属性:type:告知浏览器使用css解析器去解析
    (2)属性的写法:属性:属性值
    (3)多个属性之间使用分号;隔开

    3、外部样式
    将css样式抽取成一个单独css文件 谁去使用谁就引用
    <link rel="stylesheet" type="text/css" href="demo1.css"/>
    语法:
    (1)创建css文件 将css属性写在css文件中
    (2)在head中使用link标签进行引入
    <link rel="stylesheet" type="text/css" href="css文件地址"/>
    rel:代表要引入的文件与html的关系
    type:告知浏览器使用css解析器去解析
    href:css文件地址
    (3)属性的写法:属性:属性值

    三:CSS的属性划分

    主要分为八个板块:类型、背景、区块、方框、列表、定位和扩展。

    这些属性和属性值的定义规定了格式修饰的内容,可以帮助开发人员做出各种各样漂亮的网页。

  • 相关阅读:
    CopyOnWriteArrayList 写时复制思想
    CAS中ABA问题的解决
    彻底解决Chrome“请停用以开发者模式运行的扩展程序”提示(亲测整合)
    解决软件安装无法自定义文件夹,自动安装在C盘 (Windows系统)
    IDEA降低注解检测级别
    大白话带你认识JVM(转)
    Windows 与 Linux (CentOS7) 之间的文件共享
    Dubbo、Zookeeper 以及 Tomcat 启动的相关问题
    创建 maven 项目的时候遇到的问题
    MyBatis 项目的 jar 包导入与源码导入
  • 原文地址:https://www.cnblogs.com/funnn24/p/10538602.html
Copyright © 2011-2022 走看看