CSS样式表介绍
一、 CSS中的样式选择
1)内样式(内联样式)
style=””;
2)内嵌样式
<style type="text/css"></style>
3)外部样式
<link type="text/css" href="URL" rel="stylesheet" />
4)导入样式
@import url();
注:优先级行内 > 链接 > 内嵌 > 导入(就近原则)
二、CSS中的常用选择器
1)标签选择器
直接使用标签名来定义一个标签属性。整个文档内所有该标签将都被定义一个相同的属性。
2)类型选择器
使用.ClassName来定义一个类型的属性。当标签元素内包含class=””属性时,则具有其定义的样式。
3)ID选择器
使用#IdName来定义一个ID元素的属性。当标签元素内的ID与其定义的ID相同时,该标签则具有其定义的属性。
注:优先级 ID>类型>标签
3、CSS中的特殊选择器(在特殊情况下使用)
子对象选择器
语法:E1 > E2 。表示为选择所有作为对象E1下面的所有子对象。
属性选择器1
语法:E1[attr]。表示拥有[attr]属性的所有E1对象。
属性选择器2:
语法:E1[attr=value]。选择拥有[attr]属性的属性值等于value的E1对象
4、CSS中的常用属性
字体 Font
1) font属性,对字体进行整体控制。(可一次性设置多种属性)
2) color属性,对字体的颜色进行修改和控制。
3) font-family,对文本的字体进行修改。
4)font-size,定义文本的字体大小。
5)font-stretch:定义修改文本字体的加粗(normal:正常,narrower:加细,wider:加粗)
6)text-decoration:设置文本的修饰,装饰内容。
文本 text
1)vertical-align:设置或检索对象内容的垂直对其方式。
2)text-align:设置或检索对象中文本的对齐方式。
背景 background
1)background:对背景整体属性进行控制,设置其复合属性。
2)background-color:设置对象的背景颜色。
3)background-image:设置对象的背景图片
4)background-repeat:设置对象的背景图片的排列方式。
定位 Postioning
1)position:设置对象的定位方式。
2)top bottom left right:设置对象定位距离像素。
边框 Borders
1)border:对边框的整体属性进行控制,设置其复合属性
2)border-color:设置对象边框的颜色。
3)border-style:设置对象边框的样式。
4)border-width:设置对象边框的宽。
列表 lists
list-style:对列表的整体属性进行控制,设置其复合属性
布局 Layout
1)float:该属性的值指出了对象是否及如何浮动。
2)clear*:不允许对象浮动。both:不允许两边有对象浮动。left/right:不允许左边/右边有对象浮动。none:无浮动值。
3)display:设置或检索对象是否及如何显示。
边距 Margin/Padding
Margin:设置对象的外边距
Padding:设置对象的内边距
5、伪选择器
常用的伪选择器
a:link 设置对a未被访问前的样式属性。
a:hover 设置对象在其鼠标悬停时的样式属性。
a:active 设置对象在被激活时的样式表属性。
a:visited 设置a对象在其链接已被访问过的属性。
a:focue 设置对象成为焦点时的样式表属性。
CSS样式表介绍的更多相关文章
- DOM与CSS样式表
在前文 <DOM与元素节点内联样式>中我们了解了用 DOM 提供的接口操作元素节点内联样式的方法,今天我们来学习一下如何用 DOM 操作 CSS 样式表. CSS 样式表概况 通过使用 H ...
- 美丽的表格样式(使用CSS样式表控制表格样式)
按照WEB2.0风格,设计了几个表格样式,希望大家喜欢. WEB2.0提倡使用div开布局,但不是要全然放弃使用表格,表格在数据展现方面还是不错的选择. 如今使用介绍使用CSS样式表来控制.美化表格的 ...
- 漂亮的表格样式(使用CSS样式表控制表格样式)
根据WEB2.0风格,设计了几个表格样式,我希望你喜欢. WEB2.0推广使用div开放式布局.但并不是完全放弃使用形式,在数据表现形式而言是一个不错的选择. 本节将介绍如何使用现在CSS样式表来控制 ...
- WEB入门三 CSS样式表基础
学习内容 Ø CSS的基本语法 Ø CSS选择器 Ø 常见的CSS样式 Ø 网页中3种使用CSS的方式 能力目标 Ø 理解CSS的 ...
- 漂亮的表格样式–>使用CSS样式表控制表格样式
依照WEB2.0风格,设计了几个表格样式,希望大家喜欢.WEB2.0提倡使用div开布局,但不是要完全放弃使用表格,表格在数据展现方面还是不错的选择.现在介绍使用CSS样式表来控制.美化表格的方法. ...
- CSS选择器及CSS样式表
前言 牛腩新闻发布系统中记忆最深的就是各种CSS选择器各种CSS样式,这些选择器之间肯定有它的优先级,包括CSS样式也一样,也是有它的优先级,本文介绍一些各种CSS选择器各种CSS样式以及它们的优先级 ...
- 深度理解CSS样式表,内有彩蛋....
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- CSS样式表
CSS样式及属性 样式标的基本概念 样式表的分类 1.内联样式表 和html联合显示,控制精确,但可重用性差,冗余多. 例:<p style="font-size:14px;" ...
- JS 控制CSS样式表
JS控制CSS所使用的方法: <style> .rule{ display: none; } </style> 你想要改变把他的display属性由none改为inline. ...
随机推荐
- jQuery与XML
jQuery与XML 快而强的遍历系统,华丽丽的选择器语法,这或许是jQuery 那么流行的原因.当然它还有详尽的文档.它主要是用来处理HTML的,但在这里妳会看到如何应用到XML. 使用jQuery ...
- C# winform自定义Label控件使其能设置行距
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.D ...
- GIS数据格式:Geodatabase
转自:http://www.cnblogs.com/quansixiang/archive/2010/09/17/1829286.html 1 Geodatabase概念 Geodatabase是A ...
- MySql定位执行效率较低的SQL语句
MySQL能够记录执行时间超过参数 long_query_time 设置值的SQL语句,默认是不记录的. 获得初始锁定的时间不算作执行时间.mysqld在SQL执行完和所有的锁都被释放后才写入日志.且 ...
- C++之编码问题(Unicode,ASCII,本地默认)
本篇文章试图回答的问题: 1.char* pStr="我aa";这句代码执行后,pStr指向的内存区域中存储的字节到底是根据什么码表而来的呢?该字符串占几个字节? 2.将一个VS2 ...
- java 小结1(static ,final,泛型)
static,final. (1)final: final:属于“终态”,意思就是不可以改变.可以修饰非抽象类,非抽象类的方法等.反正就是不能够再改变赋值了. 注意:1)fina类不能被继承,所以它没 ...
- 终端ls显示的配色方案
打开~/.profile或者mac上的~/.bash_profile,加入: export CLICOLOR=1 export LSCOLORS=cxdxfxexbxegedabagacad 这是我的 ...
- hadoop入门必备基础知识
1.对Linux 系统的要求 会基本的命令: (1)知道root用户 (2)ls命令会查看文件夹内容 (3)cd命令等2.Java 的要求 ...
- 中局域网LAN中建立局域网可访问的类GitHub的服务器
There are several ways to do this Host internal repositories like Gitlab (free software) or Stash. T ...
- "判断this指针是不是null有什么意义呢"
博客搬到了fresky.github.io - Dawei XU,请各位看官挪步.最新的一篇是:"判断this指针是不是null有什么意义呢".