Posts Tagged ‘CSS’

CSS Properties Tag Cloud

Tuesday, January 15th, 2008

css, css properties, css tag cloud

Yesterday I was playing with Adobe Photoshop and I decide to (try) make a Tag Cloud with CSS 2 Properties. The result is ok! If you use the image please tell the source. Thank you!
(more…)

Create a simple MENU in CSS

Tuesday, October 30th, 2007

Today we create a simple MENU in CSS. Click here to see the final result!

[1] Let’s to create the CSS:

<style type=”text/css”>
body {
text-align: left;
background-image: url(”bg.gif”);
}
div {
width: 100px;
height: 20px;
background-color: #338ce8;
}
div:hover
{
background-color: #085ea6;
}
a {
color: white;
font-size: 18px;
text-decoration: none;
}
</style>

(more…)

Links and Pseudo-Classes in CSS

Sunday, October 28th, 2007

Today we learn about Links and Pseudo-Classes in CSS. I have made tutorials about rollover’s here and here, but this is something different and we talk about links & elements where we can put Pseudo-Classe, on a div, text,etc…

Pseudo-Classes:

:link
:visited
:active
:hover
:focus

(more…)

Create Rollover Image in CSS

Wednesday, October 24th, 2007

Create Rollover Image in CSS ( You can see the final result HERE )

I made two buttons for this tutorial, save it if you want to work with them.


(more…)

CSS id and them selections

Sunday, October 7th, 2007

Learn how to create and select the CSS ids and use them in a short tutorial and with an HTML page exemple:

(more…)

CSS Classes and them selections

Sunday, October 7th, 2007

Learn how to select the CSS classes and use them in a short tutorial and with an HTML page exemple:

(more…)

3 Methods to implement CSS in your website

Sunday, October 7th, 2007

First Method:

<style type=”text/css”>

Next is the HTML code and CSS in a simple webpage

<html>
<head>
<title>CSS Implement v1</title>
<style type=”text/css”>
P {background-color: grey;}

</style>
</head>
<body>
<p>CSS Implements v1 with paragraph background color GREY</p>
</body>
</html>

Second Method:
(more…)

Create smaller CSS files

Friday, October 5th, 2007

This article will tell you how to make your CSS files a bit smaller. You can ask yourself one question; Why shouldn’t you? Read on to find out how to do this.

There are only advantages of making your CSS files some smaller. When your website uses a 5k CSS file, you might not see the difference in loading time, but when using bigger (25k) files, you can notice your website will load a bit faster when using some of the steps below. Another thing is that your file will become more organized and clean. Read on to get tips of improvement.

The main idea of this article is to reduce the number of characters you have used in your CSS. The less characters, the smaller your file.

Comments

You have different ways of using comments. Comments may be something you can not delete in your CSS, because you might forget something (or your fellow-workers). But, there are a couple ways of using them.

/*———————-*/
/*—-Comment—-*/
/*———————-*/

These lines of code do the same as:

/*Comment*/

You can still read what it says and what tips it gives. The only thing you did is to save space.

Color prefixes

(more…)

Lynda.com Covers

Thursday, October 4th, 2007

About Lynda.com: Lynda.com is an award-winning provider of educational materials, including Hands-On Training™ instructional books, the Online Training Library®, CD- and DVD-based video training, and events for creative designers, instructors, students, and hobbyists.

The lynda.com Online Training Library® and CD-ROM titles include such subjects as Photoshop, Flash, Dreamweaver, Illustrator, Office, digital photography, Web design, digital video, and many others. lynda.com’s all-star team of trainers and teachers provides comprehensive and unbiased movie-based training to an international membership of tens of thousands of subscribers. Considering the speed at which technology evolves, the Online Training Library® is a great solution for keeping your skills current.

Lynda.com - Photoshop CS2 for the Web Essential Training

Lynda.com - Photoshop CS2 FAQs

Lynda.com - Photoshop Filters

(more…)