Infinite Options in CSS. (Simple too) -- Create your own Voy Forum

[ Show ]

Support VoyForums

[ Shrink ]

VoyForums Announcement: Programming and providing support for this service has been a labor of love since 1997. We are one of the few services online who values our users' privacy, and have never sold your information. We have even fought hard to defend your privacy in legal cases; however, we've done it with almost no financial support -- paying out of pocket to continue providing the service. Due to the issues imposed on us by advertisers, we also stopped hosting most ads on the forums many years ago. We hope you appreciate our efforts.

Show your support by donating any amount. (Note: We are still technically a for-profit company, so your contribution is not tax-deductible.) PayPal Acct: Feedback:

Donate to VoyForums (PayPal):

[ Login ] [ Contact Forum Admin ] [ Main index ] [ Post a new message ] [ Search | Check update time | Archives: 1, 2, 3, 4, 5, 6, 7, [8] ]

Subject: Infinite Options in CSS. (Simple too)

Author:
moderator.

[ Next Thread | Previous Thread | Next Message | Previous Message ]

Date Posted: 09:42:44 01/30/13 Wed
In reply to: Moderator 's message, "How to create your own Forum" on 19:08:17 01/29/13 Tue

So, in the previous lesson,
you're being told to input simple letters into the option boxes.
So, when it asks for
Title 1 (ie. Subject/TD tag):
You're supposed to input the letters chd

and, so on. It's that simple.
Now, you've unleashed the power of CSS.
And, you needn't have any knowledge of CSS whatsoever.

Just toggle the #000000 colors, etc to your liking.

Here's the CSS sequence which creates a darkish blue appearance.

-----------------------------------------

.cb{background-color:#9d9d9d}
.chd{background-color:#7a7789;font-family:arial;font-weight:bold;color:#ffffff}
.c1{background-color:#aed1e8}
.c2{background-color:#ddE4FF}
.cp{background-color:#85a5b4}
.va{color:#000099;font-style:italic;font-weight:bolder}
.vu{font-style:italic;font-weight:bold}
.ttm{font-size:9pt}

------------------------------------

Or, maybe, try this one (just for practice).

this creates a strong, bright Baby Blue appearance.
-------------------------------------

.cb{background-color:#9d9d9d}
.chd{background-color:#7a7789;font-family:arial;font-weight:bold;color:#ffffff}
.c1{background-color:#aed1e8}
.c2{background-color:#ddE4FF}
.cp{background-color:#99ccff}
.va{color:#000099;font-style:italic;font-weight:bolder}
.vu{font-style:italic;font-weight:bold}
.ttm{font-size:9pt}

[ Next Thread | Previous Thread | Next Message | Previous Message ]

Replies:

[> Subject: Step 6: CHANGE EVERYTHING.

Author:
moderator
[ Edit | View ]

Date Posted: 10:23:28 01/30/13 Wed

Let's TRY to make sense of this.....
-------------------------------
.cb{background-color:#9d9d9d}
-------------------------------
this appears to put a "Halo" around your
entire box of comments.
So, if the number is light green (FFCC99),
it will appear like a pleasant halo.
Or, if you choose dark blue (CCFF99),
it will seem stronger and more pronounced.

--------------------------------------
.chd{background-color:#7a7789;font-family:arial;font-weight:bold;color:#ffffff}
--------------------------------------

the number being used is a dull dark gray (7a7789).
This line alters the SUBJECT LINE.
Yes, this too can become a different color.
Although, this is not the most important feature.
Still though, let's try FF9999.
and the subject becomes orange.
It might be better off Dull Gray (lol).
The FFFFFF should probably be left alone.
This changes the color of the text. NOT a good idea.

------------------------------------
.c1{background-color:#aed1e8}
------------------------------------
THIS LINE IS IMPORTANT.
It changes the color of all your TOPICS.

-----------------------------------
.c2{background-color:#ddE4FF}
-----------------------------------
IMPORTANT IMPORTANT
This line alters the entire color of
your messages AND Body.
This will also effect after you've clicked inside.
So, the entire thread will bear this color.

------------------------------------
.cp{background-color:#99ccff}
------------------------------------
This line controls that huge box which says
"post a New Public Comment".
Sometimes, you may choose the same color as
the subject. That works nice.
Or, you can try a slightly different shade.
Of course, it's a good idea to keep a theme.
So, it's nice to use varying shads of blue, for instance.

----------------------------------------------
.va{color:#000099;font-style:italic;font-weight:bolder}
.vu{font-style:italic;font-weight:bold}
.ttm{font-size:9pt}
----------------------------------------------
The final 3 lines should be fine, in their current state.