css层叠样式表,主要作用就是解决内容与表现分离的问题。html标签有自己的意义当然也是有自己的默认样式的,但有时候我们想修改他的样式,这时候就需要了css。

例:给字体加上颜色,我们有如下几种方法:

  1、<h1><font color="red" size="11px">123</font></h1>

  2、在head里面加上style:

<style type="text/css">
                  h1{color: blue;font-size: 50px;}
           </style>

  3、<h1 style="color:#ff0">123</h1>

  4、在head里面加上link引入外部css

在这四种写入css的方式中:第一种方式现在基本不用了;第二种样式是“内部样式”;第三种是“内联样式”;最后一种是“外部样式”;优先级:第一种>第三种>第二种>第四种。

!important是为了提升样式优先级,不到万不得已不要用了,因为样式生效的话是依次执行的,也就是后面的样式会覆盖前面的。

css选择器:

  1、标签选择器,如:h1{属性:值}

  2、分组选择器,如:h1,p{属性:值};指h1和p元素的共有样式

  3、id选择器,如:#标签的id属性值(id值不能重复){属性:值}

  4、派生选择器,如:h1 p{属性:值};指h1里面的p元素的样式                               h1{color: blue;font-size: 50px;}

  5、类选择器,如:.标签的类属性值 {属性:值}

  6、伪类选择器,如:a: hover{属性:值}

选择器间可以组合使用

css具体写法:

以上均为个人观点,欢迎指正、讨论。

css简单介绍的更多相关文章

  1. CSS简单介绍及应用

    CSS的简介 概述: Cascading Style Sheets, 层叠样式表. 作用: 用来美化页面的. 分类: 行内样式: //直接写在元素(html的标签)中的样式. 内部样式: //写在&l ...

  2. WeX5的简单介绍及UI的简单讲解

    WeX5的简单介绍及UI的简单讲解 (2016-01-13 14:49:05) 标签: it 分类: WeX5的初步自学 一.WeX5的简单讲解 1.WeX5是前端快速开发框架,可开发跨端运行应用.是 ...

  3. HTML简单介绍及举例

    超文本标记语言(Hyper Text Markup Language,简称HTML)是为"网页创建和其他可在网页浏览器中看到的信息"设计的一种标记语言.HTML被用来结构化信息,也 ...

  4. css简单了解

    今天主要是说一下css样式表!HTML结合他使用可以是HTML页面变得很绚丽多彩! 先简单介绍一下为什么要使用CSS(Cascading Style Sheets)层叠样式表! 1.因为CSS样式表可 ...

  5. webpack入门篇--1.简单介绍

    简单介绍: webpack是一个模块打包工具,给js准备的打包工具,可以把很多的模块打包成很少的文件 目标: 1.切分依赖数,分到不同代码块里,按需加载,懒加 载 2.任何静态资源都可以被视为一个模块 ...

  6. Eclipse rap 富客户端开发总结(1) :rap简单介绍和开发环境搭建

    一.rap简单介绍 1 基本概念     RAP可以让开发人员使用JAVA API和按照Eclipse 插件的开发模式构建基于AJAX的Web 2.0应用程序, RAP的工作原理是采用交叉编译的方式将 ...

  7. Fiddler使用简单介绍

     一,fiddler简介 1.1,什么是fiddler Fiddler是一个http协议调试代理工具,它能够记录并检查所有你的电脑和互联网之间的http通讯,设置断点,查看所有的"进出&qu ...

  8. jQuery系列 第一章 jQuery框架简单介绍

    第一章 jQuery框架简单介绍 1.1 jQuery简介 jQuery是一款优秀的javaScript库(框架),该框架凭借简洁的语法和跨平台的兼容性,极大的简化了开发人员对HTML文档,DOM,事 ...

  9. 浏览器中 F12 功能的简单介绍

    chrome浏览器中 F12 功能的简单介绍 由于F12是前端开发人员的利器,所以我自己也在不断摸索中,查看一些博客和资料后,自己总结了一下来帮助自己理解和记忆,也希望能帮到有需要的小伙伴,嘿嘿! 首 ...

随机推荐

  1. BZOJ 3510: 首都 LCT + multiset维护子树信息 + 树的重心

    Code: #include<bits/stdc++.h> #define maxn 200000 #define inf 1000000000 using namespace std; ...

  2. PAT_A1140#Look-and-say Sequence

    Source: PAT A1140 Look-and-say Sequence (20 分) Description: Look-and-say sequence is a sequence of i ...

  3. GETDATE()

    定义和用法 GETDATE() 函数从 SQL Server 返回当前的时间和日期. 语法 GETDATE() 实例 例子 1 使用下面的 SELECT 语句: SELECT GETDATE() AS ...

  4. ptyhon获取app设备号、包名、activity

    直接上代码: import time import os import re import sys #------------------------------------------------- ...

  5. Selenium三种等待的使用方式

    在UI自动化测试中,必然会遇到环境不稳定,网络慢的情况,这时如果你不做任何处理的话,代码会由于没有找到元素,而报错.这时我们就要用到wait(等待),而在Selenium中,我们可以用到一共三种等待, ...

  6. constraint、index、view(day04)

    回顾: 1.sql99中的表连接 select 字段列表 from 左表 {[inner]|{left|right|full} [outer]} join 右表 on 关联条件; 集合操作 union ...

  7. vue.js 中 data, prop, computed, method,watch 介绍

    vue.js 中 data, prop, computed, method,watch 介绍 data, prop, computed, method 的区别 类型 加载顺序 加载时间 写法 作用 备 ...

  8. CodeForces 551E GukiZ and GukiZiana

    GukiZ and GukiZiana Time Limit: 10000ms Memory Limit: 262144KB This problem will be judged on CodeFo ...

  9. BZOJ 2150 cogs 1861 [国家集训队2011]部落战争

    题目描述 lanzerb的部落在A国的上部,他们不满天寒地冻的环境,于是准备向A国的下部征战来获得更大的领土. A国是一个M*N的矩阵,其中某些地方是城镇,某些地方是高山深涧无人居住.lanzerb把 ...

  10. mysql 服务器监控系列-黄杉 mysqldba

    http://blog.csdn.net/mchdba/article/category/2220809