If this is your first visit, be sure to
check out the FAQ by clicking the
link above. You may have to register
before you can post: click the register link above to proceed. To start viewing messages,
select the forum that you want to visit from the selection below.
Hey Alzar, good timing, I actually found a really good CSS tutorial a while back. Taught me everything I needed to know, and it's very clear and easy to understand. Hope it helps!
Hey Alzar, good timing, I actually found a really good CSS tutorial a while back. Taught me everything I needed to know, and it's very clear and easy to understand. Hope it helps!
Basically I took out a bunch of web design books about a year ago and pieced a lot of it together using that and lots of lots of help from Dreamweavers references....
And another place I would recommend looking at is http://www.alistapart.com/ good place for general design tips.
CSS is great and a lot better than using attributes for every tag. Just give a tag a class or an id and you can set all the attributes using CSS, and you don't have to copy and paste the attributes for every tag with the same ones. Plus if you use it on multiple pages it reduces bandwidth if the browser caches the stylesheet.
What sucks is the lack of standards and browsers displaying CSS properly. Though CSS still does some dumb things (especially with measuring the height of float elements without explicitly stating them), but it does a lot of nice stuff that would otherwise require complicated Javascript.
Just remember that positioning things absolutely will completely take it out of all automatic placement calculations. Absolute you have to specify the positioning of it explicitly or all absolutely placed elements will start at (0,0). Relatively positioned or the default positioning scheme will place things automatically, so moving any of those elements will also move others.
A lot of it is trial and error, but it looks a lot cleaner than using table tags for everything, since tables are supposed to be used for tabular data not layout. To achieve table like layouts the float attribute is your friend, just remember to also use clear once you are on a new line of layout.
And the <style> tag is also considered CSS, which the pavilion still has. It's the same as just putting it in an external stylesheet file. What's really fun is using PHP to create your stylesheet page, allowing you to use color definitions by name, put absolute paths to images, and create 3D borders automatically.
What I meant by "discarded it from the pavilion", is the layout blaze made for me before the site-forum integration used nothing BUT CSS. Considering I didnt know anything about it, I really hated working with that layout. which is good, since most people hated looking at it.
What I meant by "discarded it from the pavilion", is the layout blaze made for me before the site-forum integration used nothing BUT CSS. Considering I didnt know anything about it, I really hated working with that layout. which is good, since most people hated looking at it.
Ah, I see.
CSS is still better than laying out using HTML and tables or frames (though frames can have their purpose using PHP, divs, or AJAX are better alternatives now). CSS usually leads to cleaner code, though you have to keep up with both the HTML and the CSS, but it makes it easier to design things I think. Mainly because it makes it easier to do repeated elements styles.
Of course CSS is much easier to understand if you only use it to style classes and ids. Doing things like
li ul li ul li {
style info
}
Makes it really hard to track what that actually effects.
ul
--li
----ul
------li
--------ul
----------li this is the one affected
Where as on the one affected you do something like
li class = 'third-level menu-option'
(means the li is of the class menu-option and third-level)
then have style definitions
menu-option {
// for general menu options
}
third-level {
// special style for the third level
}
So it's really nice to use once you learn how it works, and what doesn't work correctly with each browser (mainly IE, but others mess things up too).
Of course now CSS support is much better, as finally the Web is leaning towards actual standards, and the browsers are finally recognizing them.
Basically CSS is a way to define attributes for multiple tags, instead of having to put them in each tag. Also it gets rid of having to use the font tag everywhere (which is now deprecated since HTML 4.0). It just promotes better design to the code behind sites, though you can still write horrible CSS, it's supposed to help you design better.
So if you have any specific questions Alzar feel free to put them here, but I would start with w3schools as they have interactive examples. Also I would recommend getting the Web developer toolbar for either Firefox or IE. The one for IE is a bit harder to find but I believe it is on Microsofts website, the Firefox one can be found on the extensions page https://addons.mozilla.org/firefox/60/. I believe both of these let you interactively edit the CSS for the page so you can instantly see your changes.
That's surprising, that the Pavilion uses no CSS at all.
I mean, you don't have to, because it's just tables and text, but damn.
It could be so much better.
I've got more of an inspirational site for you to check out. There are no tutorials or help, everything CSS can basically be summed up here. It's not that hard. Once you start to understand how CSS works, try seeing how people use it:
Oh yeah, and get that AddOn Coolness mentioned. I've had it for years. ****, it's so nice. You can do things like view a page, and Display_Element_Information and it'll highlight every major element on the page, and information about them, for you to mess with in real time. You can validate the HTML, and CSS of a website. ****.
Comment