标签归档:CSS

CSS定义标题前面图片,背景图片详解

背景(background): 包括background-color, background-image, background-repeat, background-attachment, background-position五种属性.  

1. background-color: 指背景颜色, 其属性值有三种形式, 十六进制, 颜色名称, rgb值. 目前最为常用的是”#+十六进制数”. 例: 本站显示代码的段落背景为#EEEEEE的灰色, 代码及示例如下:  

background-color: #EEEEEE; 

2. background-image: 指背景图片, 其属性值为背景图片的地址, 代码和格式如下: 

background-image: url(http://www.maqie.com/logo.gif); 

例: 

#title a{ 
color:#444; 
padding: 30px 68px 0 40px; 
margin:0; 
background:url(images/new.gif) no-repeat 0 16px ; 

3. background-repeat: 指背景图片的重复与否以及重复方式, 有no-repeat, repeat, repeat-x, repeat-y四种属性值. 

no-repeat: 即无论背景图片的大小, 只显示单个背景图片,  如首页的第一篇文章标题前的”NEW”图标, 代码如上所示; 

repeat: 指背景图片横向和纵向重复连续显示; 

repeat-x: 指背景图片横向重复连续显示; 

repeat-y 指背景图片纵向重复连续显示;例: 查看本站css文件,可以看到以下代码: 

4. background-attachment: 指背景图片的附着方式, 有scroll(默认属性)和fixed两种属性值. scroll指背景图片随页面的滚动而滚动, 而fixed属性值则可使背景图片固定于浏览器的某个位置, 不随页面滚动而滚动.

网页中 CSS超级链接的几个属性

//链接文字移动
A { text-decoration: NONE; color: #28C7C7}
A:hover { position: relative; left:1px; top:1px; }

//去掉链接字体的下划线
A { text-decoration: NONE; color: #28C7C7}
A:hover {border-bottom:1px dashed #28C7C7}

//去掉链接字体的下划线
a:link{text-decoration:none}
a:hover{text-decoration:none}
a:visited{text-decoration:none}

//鼠标放在链接字体上的时候,链接字体变粗,
A { text-decoration: NONE; color}
A:hover {font-weight: bold;color}

去掉超级链接横线和超级链接定义 CSS

  我们可以用CSS语法来控制超链接的形式、颜色变化。

  下面我们做一个这样的链接:未被点击时超链接文字无下划线,显示为蓝色;当鼠标在链接上时有下划线,链接文字显示为红色;当点击链接后,链接无下划线,显示为绿色。

  实现方法很简单,在源代码的<head>和<head>之间加上如下的CSS语法控制:

  <style type="text/">
   <!–
   a:link{text-decoration: none;color: black}
   a:active{text-decoration:blink}
   a:hover{text-decoration:underline;color: red}
   a:visited{text-decoration: none;color:green}
   –>
   </style>

  其中:
  a:link 指正常的未被访问过的链接;
  a:active 指正在点的链接;
  a:hover 指鼠标在链接上;
  a:visited 指已经访问过的链接;
  text-decoration是文字修饰效果的意思;
  none参数表示超链接文字不显示下划线;
  underline参数表示超链接的文字有下划线