Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people, just like you, are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
Solved

Logo design on CSS

Posted on 2012-04-02
1
511 Views
Last Modified: 2012-05-09
I am working on a Logo design.

Let me explain more briefly.  On this site, Experts X Exchange, When we right click on the logo we can save the image as .png file. Our requirement is instead of saving it as .img, we need to do it on CSS.

Image which is located between Experts and Exchange should not be saved as an Image. It has to be designed through CSS or any other Style sheet.

In my case, i need a redchillie. How should i do this on CSS?
0
Comment
Question by:chokka
1 Comment
 
LVL 12

Accepted Solution

by:
Tony van Schaik earned 500 total points
ID: 37798356
Do you mean like this:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CSS logo</title>
<style type="text/css">
a.logo {
	background:url(http://www.w3.org/html/logo/badge/html5-badge-h-connectivity-css3-device-graphics-multimedia-performance-semantics-storage.png) no-repeat left top;
	display:block;
	width:357px;
	height:64px;
}
</style>
</head>

<body>
<a href="http://www.w3.org/html/logo/" class="logo"></a>
</body>
</html>

Open in new window

This doesn't have to be an ahref, this can also be a h1, div or whatever you need. This is the way i mostly use it.

There also a CSS3 way but that isn't supported by all browser yet:
http://www.ecsspert.com/play/css3-logos/twitter.php#edit

Or the SVG way:
http://www.centralscrutinizer.it/images/twitter_logo.svg

Good luck!
0

Featured Post

Master Your Team's Linux and Cloud Stack

Come see why top tech companies like Mailchimp and Media Temple use Linux Academy to build their employee training programs.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
Finding original email is quite difficult due to their duplicates. From this article, you will come to know why multiple duplicates of same emails appear and how to delete duplicate emails from Outlook securely and instantly while vital emails remaiā€¦
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.

860 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question