css 层叠样式表(英文名:Cascading Style Sheets),主要用于美化网页

1、css的表现形式

  1.1 行内样式(内嵌样式)

    写在标签内的样式,写在标签的开始部分的内部,style属性当中,即<div style=" width="100px";height="100px" "></div>

  1.2 内部样式(内联样式)

    写在HTML页面中,存放于<head></head>标签当中,样式则写在style标签中。

    <style>

      选择器{

        属性名2:属性值2;

        属性名2:属性值2;

        ......

      }

    </style>

    注意:style标签不要写在title标签上方

  1.3 外部样式(外联样式)

    写在css文件中,用的话,直接导入

    <link type="text/css" rel="stylesheet" href="文件所在的路径" />

2、css三大特性:

  2.1 继承

    父级的样式会被子级给继承。

    注意:!important不会被继承

  2.2 层叠

    当样式发生冲突的时候,样式会产生覆盖(层叠);

    解决方法为判断优先级的先后顺序或计算权重。

  2.3 优先级

    优先级的先后顺序为:

    !important > 内联样式 > ID > class(类) > 标签 > *(初始化) > 继承;

    如果记不清楚的话,可以用权重来计算,

    !important,权重值为10000;

    行内样式,例如:<div style="样式属性名:样式属性值;···"></div>,权重值为1000;

    ID名,例如:<p id="p"></p>,,权重值为100;

    class,例如:<p class="p"></p>,权重值为10;

    标签,例如:p、span、i、em等等,权重值为1;

    通配符(*)的权重值为0;

    仅仅作为参考,不能用做实际的计算。

CSS入门介绍(一)的更多相关文章

  1. CSS入门介绍

    一.背景 这里将陆续介绍前端CSS中相关知识,先介绍CSS2.1,后续会介绍CSS3的相关属性,通过该系列的文章,希望能给准备转战前端的人员一些帮助,同时也帮助自己梳理知识,文章中如有错误,欢迎指出. ...

  2. CSS入门介绍(二)CSS选择器

    css选择器 什么是选择器? 选择器是你构造好网页的结构,需要给这些结构赋予样式,这时候就需要用到选择器,利用选择器将元素与样式一一对应:两者的对应关系可以是一对一,一对多,多对一. 选择器的分类: ...

  3. html与css入门经典视频教程 千锋说要这样学

    PHP初学者看过来,老师带来的PHP入门经典视频教程,带你轻松入门,学习PHP就是这么简单. 很多人不理解为什么学习PHP要先学习HTML基础和CSS,其实PHP作为服务器的脚本语言,在开发过程中用于 ...

  4. [Python爬虫] 在Windows下安装PhantomJS和CasperJS及入门介绍(上)

    最近在使用Python爬取网页内容时,总是遇到JS临时加载.动态获取网页信息的困难.例如爬取CSDN下载资源评论.搜狐图片中的“原图”等,此时尝试学习Phantomjs和CasperJS来解决这个问题 ...

  5. [Python爬虫] scrapy爬虫系列 <一>.安装及入门介绍

    前面介绍了很多Selenium基于自动测试的Python爬虫程序,主要利用它的xpath语句,通过分析网页DOM树结构进行爬取内容,同时可以结合Phantomjs模拟浏览器进行鼠标或键盘操作.但是,更 ...

  6. CSS入门教程——定位(positon)

    CSS入门教程——定位(positon) CSS定位在网页布局中是起着决定性作用.   定位 CSS的定位功能是很强大的,利用它你可以做出各种各样的网页布局.本节就介绍一些CSS常用的定位语句. 1. ...

  7. React入门介绍(1)-ReactDOM.render()等基础

    React入门介绍-ReactDOM.render()等基础 首先,React是一个用于构建用户界面的Javascript库,但Peact并不是一套完整的MVC或MVVM的框架,它仅涵盖V-view视 ...

  8. 第五篇 CSS入门 明白 三种嵌套形式,三种常用控制器

    CSS入门 css是 层叠式样式表   css的作用是什么呢?举个抽象的例子啊,HTML是人,CSS则是衣服...   css给html穿上衣服,有三种形式: 内嵌.内联.外联. 这三种形式,优先级为 ...

  9. CSS入门指南-4:页面布局

    这是<CSS设计指南>的读书笔记,用于加深学习效果. display 属性 display是 CSS 中最重要的用于控制布局的属性.每个元素都有一个默认的 display 值.对于大多数元 ...

随机推荐

  1. Pandas系列(二)- DataFrame数据框

    一.初识DataFrame dataFrame 是一个带有索引的二维数据结构,每列可以有自己的名字,并且可以有不同的数据类型.你可以把它想象成一个 excel 表格或者数据库中的一张表DataFram ...

  2. RocketMQ_问题_启动控制台console报错,connect to <null> failed

    配置如图所示: 问题如图所示: 明明配置了nameserver参数为啥还是connect to null呢? 我的rocketmq部署在CentOS7虚拟机上,原来是没关闭防火墙,执行:systemc ...

  3. HashMap底层结构、原理、扩容机制

    https://www.jianshu.com/p/c1b616ff1130 http://youzhixueyuan.com/the-underlying-structure-and-princip ...

  4. sprin源码解析之属性编辑器propertyEditor

    目录 异常信息 造成此异常的原因 bean 配置文件 调用代码 特别说明: 异常解决 注册springt自带的属性编辑器 CustomDateEditor 控制台输出 属性编辑器是何时并如何被注册到s ...

  5. vim与程序员

    所有的 Unix Like 系统都会内建 vi 文书编辑器,其他的文书编辑器则不一定会存在. 但是目前我们使用比较多的是 vim 编辑器. vim 具有程序编辑的能力,可以主动的以字体颜色辨别语法的正 ...

  6. 解决Ubuntu 17.10设置面板打不开的问题

    问题描述 对于Ubuntu桌面系统我用得不多,最近安装了Ubuntu17.10使用,一直都没遇到什么大的问题,界面风格已经与Windows很相似,总体体验还不错.直到某一天我突然手痒痒把Dock面板从 ...

  7. 点评cat系列-简介

    面上有很多优秀的 OS 级监控系统 (比如 falcon), 这些监控系统主要聚焦在 CPU/IO/Mem/Disk 和应用端口, falcon 甚至可以监控到 JVM. 但对于应用系统内部的一些监控 ...

  8. word20161226

    1. condensed 英[kən'denst]美[kənˈdɛnst]v. (使) 变稠或变浓,浓缩( condense的过去式和过去分词 ); (使) 凝结; 简说,摘要,简述;[例句]The ...

  9. hadoop与hbase对应的支持版本

    官网信息:http://hbase.apache.org/book.html#java JDK的对应关系: 用jdk1.8+hadoop2.7.4/hadoop2.7.6+zookeeper3.4.1 ...

  10. Jmeter学习笔记03-元件作用域及执行顺序

    Jmeter可以通过鼠标拖拽来随意改变元件之间的顺序以及元件的层级关系,随着元件所在域的不同,在执行时候,会有不同效果 层级关系和元件类型决定了在测试计划中各元件的执行顺序. 1)元件的作用域: jm ...