CSS用法简介
CSS(Cascading Style Sheets层叠样式表)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
1.基本使用语法
样式类别-方向-特征 : 值;
设置颜色:
color : red;
设置字体大小
font-size : 10px;
字体描述
text-decoration : overline;
2. CSS分类(如何使用CSS)
行内样式
直接给元素添加 style="" 属性
内嵌样式
直接给元素添加一个ID或一个class属性,在head标签中(不一定)写上
<style type="text/css">
</style>
在里面写上样式的语法,并与对应的元素挂钩
外部样式
在htm文件外有一个css文件,样式写在css文件中,在html页中将这个样式文件加载进来
<link href="css路径" rel="stylesheet" type="text/css" />
3.选择器(selecter)
id选择器
#id {
/* 样式 */
}
类选择器
.className {
/* 样式 */
}
标签选择器
tagName {
/* 样式 */
}
三个样式同时使用,如果没有样式冲突,都应用
如果有冲突,同级的就近原则
如果不是同级的,ID>类>标签(专一的优先级最大)
类选择器可以使用 class="c1 c2 c3 c4" 的语法将多个类选择器作用与元素上
不规范用法:
在CSS使用中,id选择器与类选择器可以同样的作用与多个元素
id在规范中就是表示唯一,浏览器允许这么使用,但是在js执行中会出现问题
复合选择器
标签类选择器
标签.类名 { /* 样式 */ }
后面兄弟选择器
选择器+* {
/* 选中前面元素选择器的后一个元素 */
}
(+号不能省略)
后代选择器
将包含在某个元素中的元素都称为其后代
<div id="dv1">
<p>123</p>
<div id="dv2">
<span id="span1"></span>
</div>
<p>456</p>
</div>
祖代选择器 后代选择器 {
/* 样式 */
}
子代选择器
父带选择器>子代选择器 {
/* 样式 */
}
组合选择器
选择器1, 选择器2, 选择器3, ..., 选择器N {
/* 这些选择器的元素都具有这个样式 */
}
4.常用样式
文本
color
font-size
font-family
font-weight
边框
border-color
border-style
border-width
背景
background-color
布局
其他
CSS用法简介的更多相关文章
- css012 css布局简介
css012 css布局简介 一. 网页布局的类型 网页布局的类型 1.固定宽度 2.流式 3.相应式web设计 二. 如何进行css布局 1.强大的<div>标签 网页的h ...
- IOS NSInvocation用法简介
IOS NSInvocation用法简介 2012-10-25 19:59 来源:博客园 作者:csj007523 字号:T|T [摘要]在 iOS中可以直接调用某个对象的消息方式有两种,其中一种就是 ...
- JodaTime用法简介
JodaTime用法简介 Java的Date和Calendar用起来简直就是灾难,跟C#的DateTime差距太明显了,幸好有JodaTime 本文简单罗列JodaTime的用法 package co ...
- Apache自带压力测试工具ab用法简介
ab命令原理 ab命令会创建很多的并发访问线程,模拟多个访问者同时对某一URL进行访问.它的测试目标是基于URL的,因此,既可以用来测试Apache的负载压力,也可以测试nginx.lighthttp ...
- CSS 选择器简介
前言:这是笔者学习之后自己的理解与整理.如果有错误或者疑问的地方,请大家指正,我会持续更新! 选择器权重 如果以4位数表示选择符权重,那么: 元素选择器的权重是1: id 选择器的权重为100: cl ...
- Postman用法简介
转自:http://blog.csdn.net/flowerspring/article/details/52774399 Postman用法简介 转载 2016年10月10日 09:04:10 10 ...
- MSSQL Sql加密函数 hashbytes 用法简介
转自:http://www.maomao365.com/?p=4732 一.mssql sql hashbytes 函数简介 hashbytes函数功能为:返回一个字符,通过 MD2.MD4.MD5. ...
- java assert的用法简介【转】
assert的基本用法 assertion(断言)在软件开发中是一种常用的调试方式,很多开发语言中都支持这种机制,如C,C++和Eiffel等,但是支持的形式不尽相同,有的是通过语言本身.有的是通过库 ...
- glVertexAttribPointer 用法简介
在内存中采用交叉模式存储,向gpu传入顶点数据的方法 GPU: #version 100 attribute highp vec2 aPosition; attribute highp vec2 a ...
随机推荐
- 行变列 拼接字符串 MSSQL 一个超级搞的问题
由数据 ThreeLevelSortID KeyWordID KeyWordName key1 key2 key3 key4 得到数据大 ThreeLevelSortID KeyWordName ke ...
- break point
结论: 当有break point时,$m_H(N)=O(N^{k-1})$ bounding function:当break point = k,时成长函数$m_H(N)$的上限这样可以忽略假设集的 ...
- leetcode_question_111 Minimum Depth of Binary Tree
Given a binary tree, find its minimum depth. The minimum depth is the number of nodes along the shor ...
- 全国计算机等级考试二级教程-C语言程序设计_第14章_结构体、共用体和用户定义类型
函数的返回值是结构体类型 #define _CRT_SECURE_NO_WARNINGS #include<stdio.h> #include<stdlib.h> struct ...
- Redis短结构与分片
本文将介绍两种降低Redis内存占用的方法——使用短结构存储数据和对数据进行分片. 降低Redis内存占用有助于减少创建快照和加载快照所需的时间.提升载入AOF文件和重写AOF文件时的效率.缩短从服务 ...
- 浅谈css盒模型
在我们网页上的每一个元素,一个按钮,一段文本,一张图片等等,浏览器都将它们当做一个“盒子”看待,并把这样的盒子称为盒模型(box model).使用Chrome的右键>审查元素对某个网页上的元素 ...
- OAuthBase.cs
using System; using System.Security.Cryptography; using System.Collections.Generic; using System.Tex ...
- 排序算法 -- 数据结构与算法的javascript描述 第12章
排序是常见的功能,给定一组数据,对其进行排序. 在此之前,我们需要准备个基础工作--自动生成数组,并可以对该组数据做任何处理. /** * 测试类 ,数组 * @param numElements * ...
- java日期处理 calendar 和date
抄的人家的,仅作学习使用. java Date获取 年月日时分秒 package com.util; import java.text.DateFormat; import java.ut ...
- 谈谈css3的字体大小单位[rem]
最近接收了一份面试题,内容是移动端传播的H5(在中国通常这么叫)广告页. 秉承移动端web尽量少用px的概念,我使用rem进行了一次重构.对于rem,基本是给 html/body 元素定义一个字体大小 ...