一、css的简介

1.层叠样式表的含义

    层叠样式表:css是不仅是表现HTML的语言、还是进行样式修饰的语言
层叠:是对一个元素多次设置同一个样式,层层叠加覆盖,如不同的样式对一html标签进行修饰,若样式冲突,则冲突部分应用优先级高的;若不冲突,则共用
样式表:是css属性样式的集合

2.作用

    丰富html、使html样式更多样
提高css的样式复用性
使html内容与css样式分离 便于维护

3.引入方式

    内嵌样式
内嵌样式是直接把css的代码嵌入到标签中
<div style="color:green;font-size:70px;">
小老弟,针不戳
</div>
用法:
使用style属性将样式嵌入到html标签中、写法:属性:属性值
多属性之间用分号(;)隔开
**不建议使用**
内部样式
在head标签中使用style标签进行css的引入
<style type="text/css">
div{color:green;font-size:70px;}
</style>
用法:使用style标签、type属性将css的引入
<style type="text/css">
属性:type:让浏览器知道要使用css解析器去解析这个样式,写法:属性:属性值;多属性之间用分号(;)隔开 外部样式
link链接方式
把css样式做成一个单独css文件,需要便引用(jj01.css文件)
<link rel="stylesheet" type="text/css" href="jj01.css" />
用法:
创建css文件,把css样式写入文件中
在head中使用link标签进行引入
<link rel="stylesheet" type="text/css" href="路径"/>
rel:设置引入的文件对象与HTML之间的关系
type:让浏览器知道要使用css解析器去解析这个样式
href:css文件的路径
写法:属性:属性值;多属性之间用分号(;)隔开
@import方式(不推荐使用):
我们来聊聊为什么不推荐使用这个方式来引入外部样式(了解一下@import即可,不必学习)
在使用@import方式引入的时候,css是无法并行下载,浏览器首先下的引用的这个css文件,其他css文件需要等解析完成后再发现并下载,然后再解析再进行一系列操作才能把页面显示。这个问题直接说明了一个问题:网页加载时间变长,导致网页会有较长时间停留在空白页面。所以推荐使用link链接
@import方式其他缺点:
@import对部分低版本IE浏览器是不支持的
@import是等html加载完后再在加载
@import是不支持js的动态修改

注:未经同意请勿转载,仅作学习使用。以上有描述不正确之处,望大家能不吝指出,共同学习共同进步。谢谢

层叠样式表(CSS)1的更多相关文章

  1. 层叠样式表(CSS)

    层叠样式表(CSS) CSS(Cascading Style Sheet)中文译为层叠样式表.是用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言.CSS的引入就是为了使得HTML语言能够 ...

  2. __x__(16)0906第三天__层叠样式表CSS简介

    层叠样式表CSS Cascading Style Sheets 用来为网页创建样式表,通过样式表对网页进行装饰. 所谓层叠,就是将网页想象成一层一层的结构,层次高的将覆盖层次低的. CSS可以为网页的 ...

  3. css学习(1)-- 层叠样式表CSS的基础

    一.什么是CSS CSS是Cascading Style Sheets的简写,它除了可以轻松设置网页元素的显示位置和格式处,甚至还能产生滤镜,图像淡化,网页淡入淡出的渐变效果. 一个样式表由样式规则组 ...

  4. 层叠样式表css的优先级

    优先级1:外部<内部<行内优先级2:标签选择器<类选择器<ID选择器

  5. CSS学习笔记

    CSS学习笔记 2016年12月15日整理 CSS基础 Chapter1 在console输入escape("宋体") ENTER 就会出现unicode编码 显示"%u ...

  6. CSS层叠

    前面的话 层叠样式表CSS最基本的一个特性就是层叠.冲突的声明通过层叠进行排序,由此确定最终的文档表示.而这个过程的核心就是选择器及其相关声明的特殊性.重要性.来源及继承机制.本文将详细介绍CSS层叠 ...

  7. web前端:css

    css简介: web文档的结构由html元素定义,而这些html元素是如何显示的,则是由层叠样式表css来定义,这样就实现了结构与表现的分离. 1.外部样式表 可以将样式定义放在一个单独的文件中,并且 ...

  8. (转)第一天 XHTML CSS基础知识 文章出处:标准之路(http://www.aa25.cn/div_css/902.shtml)

    欢迎大家学习<十天学会web标准>,也就是我们常说的DIV+CSS.不过这里的DIV+CSS是一种错误的叫法,建议大家还是称之为web标准. 学习本系列教程需有一定html和css基础,也 ...

  9. CSS样式总结

    CSS: Cascading Style Sheet,层叠样式表 Css由三部分组成:选择符.样式属性.值: 基本语法:选择符 {样式属性:值:样式属性:值.....} 一,选择器 常用的选择器有:标 ...

  10. [CSS3] 学习笔记-CSS入门基本知识

    1.CSS概述 CSS指层叠样式表 CSS样式表极大的提高了工作效率 1)CSS基础语法: selector{ propery:value } 例1:h1{color:red;font-size:14 ...

随机推荐

  1. 一文详解RocketMQ-Spring的源码解析与实战

    摘要:这篇文章主要介绍 Spring Boot 项目使用 rocketmq-spring SDK 实现消息收发的操作流程,同时笔者会从开发者的角度解读 SDK 的设计逻辑. 本文分享自华为云社区< ...

  2. Locust 界面简介(非使用级)

    一.认识Locust 1.简介 Locust是一款易于使用的分布式负载测试工具,完全基于事件,即一个locust节点也可以在一个进程中支持数千并发用户,不使用回调,通过gevent使用轻量级过程(即在 ...

  3. vscode取消“禁用错误波形曲线”

    刚刚不小心点到了vscode的禁用错误波形曲线,导致现在没有报错提醒了,上网查了一下,重新打开错误曲线的方法是 1.按住Cctrl+shift+p 2.搜索 启用错误波形曲线,选择打开,就可以了

  4. C#实现右下角托盘程序,默认不显示窗体,关闭窗体时隐藏而不退出

    Windows右下角托盘程序是Windows系统的一大特色.在某些场景非常适用. 因业务需要实现一个后台程序,需要开机自动启动,默认不显示窗体,点击系统右下角托盘图标时显示窗体,关闭窗体时隐藏而不退出 ...

  5. 【开源游戏】Legends-Of-Heroes 基于ET 7.2的双端C#(.net7 + Unity3d)多人在线英雄联盟风格的球球大作战游戏。

    Legends-Of-Heroes 一个LOL风格的球球大作战游戏,基于ET7.2,使用状态同步  Main 基于C#双端框架[ET7.2],同步到ET主干详情请看日志.(https://github ...

  6. 2023-03-07:x264的视频编码器,不用ffmpeg,用libx264.dll也行。请用go语言调用libx264.dll,将yuv文件编码成h264文件。

    2023-03-07:x264的视频编码器,不用ffmpeg,用libx264.dll也行.请用go语言调用libx264.dll,将yuv文件编码成h264文件. 答案2023-03-07: 使用 ...

  7. 2021-04-20:手写代码:最小生成树算法之Prim。

    2021-04-20:手写代码:最小生成树算法之Prim. 福大大 答案2021-04-20: 解锁点,解锁边,解锁点,解锁边,一直解锁下去. 代码用golang编写.代码如下: package ma ...

  8. 2021-11-06:3的幂。给定一个整数,写一个函数来判断它是否是 3 的幂次方。如果是,返回 true ;否则,返回 false 。整数 n 是 3 的幂次方需满足:存在整数 x 使得 n ==

    2021-11-06:3的幂.给定一个整数,写一个函数来判断它是否是 3 的幂次方.如果是,返回 true :否则,返回 false .整数 n 是 3 的幂次方需满足:存在整数 x 使得 n == ...

  9. 巧用OpenSSH进行域内权限维持

    最近在Windows服务器上安装OpenSSH,意外发现了一个很有意思的技巧,可用来做域内权限维持,废话不多说,直接上步骤. 01.利用方式 (1)在已经获得权限的Windows服务器上,使用msie ...

  10. Cesium开发案例整理

    weigis近几年越来越被人们所关注,但是二三维开发难度也比普通web要高出许多,不管我们是在在开发或者是学习过程中,往往需要耗费大量的时间去查阅资料,和研究官方案例, 而大多二三维的包(openla ...