rgba(0,0,0,0.6)

The A stands for Alpha, which refers to the level of opacity of the colour, or to put it another way, the amount of transparency.

This means that we can set not only the red, green and blue values, but also control how much of what’s behind the colour shows through.

CSS3 introduces a couple of new ways to specify colours, and one of those is RGBA:

  • opacity level from 0 (completely transparent) to 1 (completely opaque).
  • first three values are red, green and blue. You can specify these 0-255 or 0%-100%.
h1 {
	color: rgb(0, 0, 0);
	background-color: rgb(255, 255, 255);
}

Heading with no transparency

Heading with 50% opacity on the element
h1 {
	color: rgb(0, 0, 0);
	background-color: rgb(255, 255, 255);
	opacity: 0.5;
}
Heading with 50% opacity

50% opacity on just the background colour

h1 {
	color: rgb(0, 0, 0);
	background-color: rgba(255, 255, 255, 0.5);
}
Heading with 50% opacity on just the background

50% opacity on just the foreground colour

h1 {
	color: rgba(0, 0, 0, 0.5);
	background-color: rgb(255, 255, 255);
}
Heading with 50% opacity on just the foreground
more
http://24ways.org/2009/working-with-rgba-colour/
About these ads

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

生活在西班牙

自己动手丰衣足食

BlueAsteroid

Just another WordPress.com site

Jing's Blog

Just another WordPress.com site

Start from here......

我的心情魔方

天才遠私廚

希望能做一個分享各種資訊的好地方

语义噪声

西瓜大丸子汤的博客

Augmented Reality Blog

An augmented point of view

笑对人生,傲立寰宇

Just another WordPress.com site

Where On Earth Is Waldo?

A Project By Melanie Coles

the Serious Computer Vision Blog

A blog about computer vision and serious stuff

Cauthy's Blog

paper review...

Cornell Computer Vision Seminar Blog

Blog for CS 7670 - Special Topics in Computer Vision

datarazzi

Life through nerd-colored glasses

Luciana Haill

Augmenting Consciousness with EEG

槑烎

1,2,∞

Paul Tennent

Wanderings in the Blogosphere

turn off the lights, please

A bunch of random, thinned and stateless thoughts around the Web

Follow

Get every new post delivered to your Inbox.

%d bloggers like this: