views:

48

answers:

5

Hi All,

Am developing a web app and creating few screens for it. I want to concentrate on the login and the server side code for now so I just have the bare minimum html required to display the data. But it looks ugly. Are there any free text only stylesheets that I can just include and it will look decent. I plan to work on the design later so I just a simple css that will not make me cringe when i see my page.

Regards

+2  A: 

You can look at Yahoo User Interface Library. They have good CSS Reset/Base/Fonts Stylesheets that resets inconsistent styling of HTML elements provided by browsers.

http://developer.yahoo.com/yui/
http://developer.yahoo.com/yui/3/cssreset/
http://developer.yahoo.com/yui/3/cssbase/
http://developer.yahoo.com/yui/3/cssfonts/

Also a great start to begin a new CSS Design on top of it.

Arko
Great suggestion. I start every single website with the YUI set of CSS files and build from there. Wonderful foundation for any kind of project, text-only or not.
Scottie
+1  A: 

There is no substitute for learning CSS yourself, but I find BlueTrip to be a very nice-looking starting point that's not too heavy (in terms of includes), and perfect for situations such as yours.

da5id
A: 

At this point any serious framework will be overkill for what you're doing. Just create or re-purpose a simple 1-page css template of your own.

dickysofa
A: 

There are pretty much free-template sites on the net. Maybe you could download one, wrapp it around your app and it will be fine for now. Just search google for "Free css templates" or something similar. For example: http://freecsstemplates.com/

EDIT Sorry, no I understood, what you meant by "text only". Here's a suggestion

body {
    color: #2F2F2F;
    font-size: small;
    font-family: arial, verdana, tahoma, sans-serif;
}
h1 {
    size: 130%;
    border-bottom: 1px solid #888;
}
h2 {
    size: 120%;
    border-bottom: 1px solid #888;
}
h3 {
    size: 110%;
}
h4 {
    size: 107%;
    border-bottom: 1px solid #888;
}
h5 {
    size: 105%;
}
h6 {
    size: 102%;
}
a {
    color: #39F;
    text-decoration: none;
}
a:hover {
    color: #00F;
    text-decoration: underline;
}

This of course is only a small excerpt. When I'm home I could provide a "text-only" css-template via my homepage, if you need one.

regards

faileN
A: 

Thanks a lot for all your responses. I will check out the suggestions

naba