hi5 Forums

[Andrew]

Journal Entries

Text Options

Text Color:

Code: Select all

#journal-entries {color: -color?-;}

-color?- = Any Hex code, RGB value or HTML name Color Code
Formats:
(1) Hex code (#FF0000)
(2) RGB value (rgb(255,0,0))
(3) HTML name (red)

Examples:
#journal-entries {background-color: #FF0000;}
#journal-entries {background-color: rgb(255,0,0);}
#journal-entries {background-color: red;}

[Click Here to view list of Color Codes]
http://www.hi5-world.com/ColorCodes.htm




Font Type:

Code: Select all

#journal-entries {font-family: -font-family?-;}

-font-family?- = Any Font name

Example:
#journal-entries {font-family: Arial;}




Font Size:

Code: Select all

#journal-entries {font-size: -size?-px;}

-size?- = Any numeric positive value (or at size: 0px text is not visible)

Example:
#journal-entries {font-size: 16px;}



Font Style:

Code: Select all

#journal-entries {font-style: -font-style?-;}

-font-style?- = Any of the below options:
normal
italic
oblique

Example:
#journal-entries {font-style: italic;}



Font Weight:

Code: Select all

#journal-entries {font-weight: -font-weight?-;}

-font-weight?- = Any of the below options:

normal
bold

Example:
#journal-entries {font-weight: normal;}



Text-Align:

Code: Select all

#journal-entries {text-align: -text-align?-;}

-text-align?- = Any of the below options:

left
right
center
justify

Example:
#journal-entries {text-align: center;}



Text-Indent:

Code: Select all

#journal-entries {text-indent: -text-indent?-%;}

-text-indent?- = Any number from 0 - 100

Example:
#journal-entries {text-indent: 25%;}



Text-Decoration:

Code: Select all

#journal-entries {text-decoration: -text-decoration?-;}

-text-decoration?- = Any of the below options:

none
underline
overline
line-through
blink

Example:
#journal-entries {text-decoration: underline;}




Link Options

Link Color:

Code: Select all

#journal-entries a {color: #[color=#FF0000]-color?-[/color];}

-color?- = Any Hex code, RGB value or HTML name Color Code
(As described earlier in this page)

Example:
#journal-entries a {color: ##FF0000;}



Font Type:

Code: Select all

#journal-entries a {font-family: [color=#FF0000]-font-family?-[/color];}

-font-family?- = Any Font name

Example:
#journal-entries a {font-family: Arial;}




Font Size:

Code: Select all

#journal-entries a {font-size: -size?-px;}

-size?- = Any numeric positive value (or at size: 0px text is not visible)

Example:
#journal-entries a {font-size: 16px;}



Font Style:

Code: Select all

#journal-entries a {font-style: -font-style?-;}

-font-style?- = Any of the below options:
normal
italic
oblique

Example:
#journal-entries a {font-style: italic;}



Font Weight:

Code: Select all

#journal-entries a {font-weight: -font-weight?-;}

-font-weight?- = Any of the below options:

normal
bold

Example:
#journal-entries a {font-weight: normal;}



Text-Align:

Code: Select all

#journal-entries a {text-align: -text-align?-;}

-text-align?- = Any of the below options:

left
right
center
justify

Example:
#journal-entries a {text-align: center;}



Text-Indent:

Code: Select all

#journal-entries a {text-indent: -text-indent?-%;}

-text-indent?- = Any number from 0 - 100

Example:
#journal-entries a {text-indent: 25%;}



Text-Decoration:

Code: Select all

#journal-entries a {text-decoration: -text-decoration?-;}

-text-decoration?- = Any of the below options:

none
underline
overline
line-through
blink

Example:
#journal-entries a {text-decoration: underline;}





Visibility Options


Opacity

Code: Select all

#journal-entries {filter:alpha(opacity=IE??); opacity: FF??;}

IE?? = any integer value from 0 - 100

FF?? = Must be 1/100th of the previous IE?? value.
(or IE?? X 0.01)

Example:
#journal-entries {filter:alpha(opacity=70); opacity: 0.7;}



Hide entire Journal Entries section

Code: Select all

#journal-entries {display: none;}

Hide the heading "Journal" only:

Code: Select all

#journal-entries .box_profile_info_small_heading {display: none;}

Hide all "Links" in this section:

Code: Select all

#journal-entries a {display: none;}

Background Options
These options affect the "invisible" box area the Journal Entries section is encased in.
These options are not usually used, but it can be useful if you have a good imagination.


Choose Background Color:

Code: Select all

#journal-entries {background-color: -color?-;}

-color?- = Any Hex code, RGB value or HTML name Color Code

Formats:
(1) Hex code (#FF0000)
(2) RGB value (rgb(255,0,0))
(3) HTML name (red)

Examples:
#journal-entries {background-color: #FF0000;}
#journal-entries {background-color: rgb(255,0,0);}
#journal-entries {background-color: red;}

[Click Here to view list of Color Codes]
http://www.hi5-world.com/ColorCodes.htm



Choose Background Image:

Code: Select all

#journal-entries {background-image: url(-url?-);}

-url?- = Any image url

Example:

#journal-entries {background-image: url(http://forums.hi5-world.com/images/Background.jpg);}



Background Repeat:

Code: Select all

#journal-entries {background-repeat: -repeat?-;}

[?] -repeat?- = Any of the below options

[1]repeat : The background image will be repeated vertically and horizontally.
[2]repeat-x : The background image will be repeated horizontally.
[3]repeat-y : The background image will be repeated vertically
[4]no-repeat : The background-image will be displayed only once

Example:
#journal-entries {background-repeat: no-repeat;}



Background Position:

Code: Select all

#journal-entries {background-position: -x-% -y-%; background-attachment: fixed;}

Horizontal Position: -x-%
Vertical Position: -y-%

Position Values must be between 0 - 100%

Example:

#journal-entries {background-position: 20% 65%; background-attachment: fixed;}




Hover Effects

Code: Select all

#journal-entries:hover {-Code Here-;}

By substituting,

#journal-entries
for
#journal-entries:hover

All of the above codes, (Background Options, Text Options, Visibility Options), can be used to give a different effect on the target, when the Mouse Pointer is hovered over the object in the Journal Entries.

Example:
#journal-entries:hover {background-image: url(http://forums.hi5-world.com/images/Background_Hover.jpg);}

This will give you a different background image when you hover over the Journal Entries




Targeted Text Editing

All of the above "Text", "Visibility" and "Hover" options can be used to alter the Journal Heading individually.


Edit the heading "Journal" only:

Code: Select all

#journal-entries .box_profile_info_small_heading {-code?-;}

Replace

#journal-entries
for
#journal-entries .box_profile_info_small_heading

Example:
#journal-entries .box_profile_info_small_heading {font-weight: normal;}