[web] My last website.
That would be CSS: You can do almost anything with it design-wise, putting things further apart, pushing them closer together, deciding what color text will be based on what tag the text is in (i.e. everything in <p> tags is orange, everything else is white), whether something is visible or not (which can be changed dynamically w/ javascript), etc. etc. etc.
If you want something like that site you should learn tables (I recommend that before you do css), and then you'll need to get really good at creating graphics. Once you are comfortable with tables, I'd say you should do css then. :)
I know how to do tables, its just they are aggravating by hand. I use FrontPage to generate my table script. Is this a mistake? I mean, I do know how to write them...
Front Page is pretty ghastly but as long as you tidy up a little by hand it should be all right.
CSS is useful. For example, just adding:
<style>
p {
font-family: verdana;
font-size: 0.9em;
color: #FF00FF;
}
</style>
...would set all the text inside paragraph tags to that font.
I'd say PHP is much, much more useful than javascript (which is not that useful, really).
CSS is useful. For example, just adding:
<style>
p {
font-family: verdana;
font-size: 0.9em;
color: #FF00FF;
}
</style>
...would set all the text inside paragraph tags to that font.
I'd say PHP is much, much more useful than javascript (which is not that useful, really).
Especially all the new browsers disable it for Cookie blocking and stuff. I know about the handy dandy editing features of CSS, but not the rest.
I also know that the
I don't understand how it may be used for making a site without those ugly HTML spaces.
I also guess they use CSS on the forums with the
All {}s should actually be the greater and less than signs. If I put them in those however, the forum actually reads it as HTML and won't display it.
I also know that the
{h1}, {h2}, ...
tags can be edited with CSS at once, and that is what I use it for. (Not on the MMoR site)I don't understand how it may be used for making a site without those ugly HTML spaces.
I also guess they use CSS on the forums with the
{h1}
tags and such as displayed by them creating that new font.All {}s should actually be the greater and less than signs. If I put them in those however, the forum actually reads it as HTML and won't display it.
I've never seen a (recent) browser blocking javascript, nor cookies, by default.
What are these ugly HTML spaces? If you mean the spaces above and below items in tags (such as the p, h1/h2/h3/hn tags and so on) you can edit the spacing with the padding and margin styles.
What are these ugly HTML spaces? If you mean the spaces above and below items in tags (such as the p, h1/h2/h3/hn tags and so on) you can edit the spacing with the padding and margin styles.
Ah thanks, I'll keep that for future reference, but I found another way to do it. I am going to find their CSS page link in the source.
Here is the sneaky little stylesheet, displayed for everyone to see.
.calendarhead {
font-family:tahoma,verdana, arial, sans-serif;
color:white;
font-size:13px;
font-weight:bold;
padding:6px;
background: #333366;
}
.calendar {
font-family:verdana, arial, sans-serif;
color:#B0B0B0;
background:#333344;
font-size:10px;
font-weight:normal;
padding:4px;
}
.calendarsel {
font-family:verdana, arial, sans-serif;
background:#6699cc;
font-size:13px;
font-weight:bold;
padding:4px;
}
.calendarlink {
color:white;
}
ul#tabnav {
font: bold 11px verdana, arial, sans-serif;
list-style-type: none;
padding-bottom: 24px;
border-bottom: 1px solid #333399;
margin: 0;
}
ul#tabnav li {
float: left;
height: 21px;
background-color: #20205C;
margin: 2px 2px 0 2px;
border: 1px solid #3333AD;
}
body#tab1 li.tab1, body#tab2 li.tab2, body#tab3 li.tab3, body#tab4 li.tab4 {
border-bottom: 1px solid #333399;
background-color: #333399;
}
body#tab1 li.tab1 a, body#tab2 li.tab2 a, body#tab3 li.tab3 a, body#tab4 li.tab4 a {
color: white;
}
#tabnav a {
float: left;
display: block;
color: #a09dc3;
text-decoration: none;
padding: 4px;
}
#tabnav a:hover {
background: #5555DD;
color: white;
}
Here is the sneaky little stylesheet, displayed for everyone to see.
.dummy {font-size: 10px} BODY {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10pt; color: #FFFFFF; background: #000000; margin: 0px;}P, TD, OL, UL, DL {font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10pt; color: #FFFFFF} A:link {text-decoration: none; color: #EEEE88} A:visited {text-decoration: none; color: #EEEE88} A:active {text-decoration: none; color: #9999FF} A:hover {text-decoration: none; color: #9999FF} .img { border: 0px solid #000; vertical-align: middle; } .smallfont {font-size: 10px} .mediumfont {font-size: 11px} .largefont {font-size: 18px} .regularfont {font-size: 10pt; color: #FFFFFF; font-family: Verdana, Arial, Helvetica, sans-serif} .path {font-size: 10px; color: silver} .head {color: silver; background: #333399} .headsmall {font-family: verdana, sans-serif; font-size: 10px; color: silver; background: #333399; border-top: solid 1px #394CB8; border-left: solid 1px #394CB8;} .category {color: silver; background: #333366; border-top: solid 1px #434376; border-left: solid 1px #434376; border-bottom: solid 1px #232356; border-right: solid 1px #232356;} .postcell {font-size: 10px; color: silver; background: #333366} .forumcell {background: #2C2C30; border-top: solid 1px #303040; border-left: solid 1px #303040; border-bottom: solid 1px #090920; border-right: solid 1px #090920;} .altforumcell {background: #2A2C3D; border-top: solid 1px #3A3A4A; border-left: solid 1px #3A3A4A; border-bottom: solid 1px #090920; border-right: solid 1px #090920;} .announcecell {background: #333366; overflow: auto; border-top: solid 1px #434376; border-left: solid 1px #434376; border-bottom: solid 1px #232356; border-right: solid 1px #232356;} .threadhighlight {background: #003366} .time {color: #FFFF88} .staff { color: #43FF43} .moderator { color: #FFA07A } .premium { color: #FFEA00; font-weight: bold } .premiumusernames { color: #F2D366; } .suspended { color: #FF6C12 } .banned { color: red } .quote { font-size: 11px; background: #3B3D62; border-top: solid 1px #5B5D82; border-left: solid 1px #5B5D82; border-bottom: solid 1px #1B1D42; border-right: solid 1px #1B1D42;} .quote .quote { font-size: 11px; background: #383560; border-top: solid 1px #484570; border-left: solid 1px #484570; border-bottom: solid 1px #1B1D42; border-right: solid 1px #1B1D42;} .quote .quote .quote { font-size: 11px; background: #343156; border-top: solid 1px #444166; border-left: solid 1px #444166; border-bottom: solid 1px #242146; border-right: solid 1px #242146;} .quote .quote .quote .quote { font-size: 11px; background: #302853; border-top: solid 1px #5B5D82; border-left: solid 1px #5B5D82; border-bottom: solid 1px #1B1D42; border-right: solid 1px #1B1D42;} .forumrules {border: solid #555555 2px; font-family: verdana, sans-serif; color: white; font-size: 10px} .source {background: #ffffff; border: solid 2px; font-family: Courier New; color: black; font-size: 9pt; width: 95%; height: 250px; overflow: auto; padding: 3px;} .editedby {color: #DDDDDD; font-size: 10px;} .register_required { color: red} .cpp-pre {background: #ffffff; border: solid #888888 2px; font-family: Courier New; color: black; font-size: 9pt; width: 630px; height: 250px; overflow: auto; padding: 3px;} .cpp { font-family : Arial, sans-serif; background-color :#FFFFBB; font-size:12px; border-width : 1px; border-style : solid; border-color : #BBBBBB;} .cpp-blockdoc { color: #00FF00; font-family: Arial, sans-serif;} .cpp-linedoc { color: #2eFF57; font-family: Arial, sans-serif;} .cpp-code {color:#000000; font-family:Arial, sans-serif;} .cpp-literal {color: #8B0000; font-family: Courier;} .cpp-keyword {color: blue; font-family: Courier;} .cpp-comment {color: gray; font-family: Courier;} .cpp-number {color: purple; font-family: Courier;} .cpp-directive {color: green; font-family: Courier;} .java-literal {color: #8B0000; font-family: Courier;} .java-keyword {color: blue; font-family: Courier;} .java-comment {color: gray; font-family: Courier;} .java-number {color: purple; font-family: Courier;} .java-primitives {color: #ff6699; font-family: Courier;} .java-storageclasses {color: #ff6633; font-family: Courier;} .java-visibilitymodifier {color: #00008B; font-family: Courier; font-weight: bold;} .vb-literal {color: #8B0000; font-family: Courier;} .vb-keyword {color: blue; font-family: Courier;} .vb-comment {color: gray; font-family: Courier;} .vb-function {color: #00008B; font-family: Courier; font-weight: bold;} .vb-method{color: green; font-family: Courier;} .asm-keyword {color: #ff6666; font-family: Courier;} .asm-function {color: #00008B; font-family: Courier; font-weight: bold} .asm-comment {color: gray; font-family: Courier;} .asm-string {color: #8B0000; font-family: Courier;} .asm-number {color: purple; font-family: Courier;} .asm-register {color: #cc6666; font-family: Courier;} .news-table {} .news-headline { font-family: tahoma, verdana, sans-serif; font-weight: bold; font-size: 17pt;} .news-byline { font-family: verdana, sans-serif; font-size: 8pt } .news-author { font-family: verdana, sans-serif; font-size: 8pt } .news-date { font-family: verdana, sans-serif; font-size: 8pt } .news-story { font-family: verdana, sans-serif; font-size: 10pt } .boxtext {font-size: 11px; background: #333366; border-top: solid 1px #434376; border-left: solid 1px #434376; border-bottom: solid 1px #232356; border-right: solid 1px #232356;} .boxheadr {font-weight: bold; background: #333399; border-top: solid 1px #394CB8; border-left: solid 1px #394CB8;} .featmenu {background: #333366; border-top: solid 1px #434376; border-left: solid 1px #434376; border-bottom: solid 1px #232356; border-right: solid 1px #232356;} .feattitle {font-size: 10pt; font-weight: bold;} .featbody {font-size: 11px; background: #1B1B3D; border-top: solid 1px #434376; border-left: solid 1px #434376; border-bottom: solid 1px #232356; border-right: solid 1px #232356;} .spotlighthdr {font-weight: bold; background: #4D9933; border-top: solid 1px #437643; border-left: solid 1px #437643; border-bottom: solid 1px #235623; border-right: solid 1px #235623;} .spotlightbody {font-size: 11px; background: #1B3D29; border-top: solid 1px #437643; border-left: solid 1px #437643; border-bottom: solid 1px #235623; border-right: solid 1px #235623;} .tableheadr {font-size: 15px; font-weight: bold; background: #6666CC} .menuheadr {font-size: 12px; font-weight: bold; background: #333399; border-top: solid 1px #394CB8; border-left: solid 1px #394CB8;} .menubody {font-size: 11px; font-weight: bold; background: #333366; border-top: solid 1px #434376; border-left: solid 1px #434376; border-bottom: solid 1px #232356; border-right: solid 1px #232356;} .threadmessage {font-size: 11px; font-weight: bold} .threadtime {font-size: 11px; color: #AAAAAA} .submitbutton {font-family: Verdana, sans-serif; font-size: 11px; font-weight: bold; background: #666666; color: white} .textfield {background: #000000; color: #FFFFFF; font-family: Verdana, sans-serif; font-size: 11px} .inlinebox {border: solid #FFFFFF 1px; background: #223344; padding: 10px} .subtle {font-size: 11px; color: #666666; font-weight: normal} .ZWNewsFmt01-Date {background-color: #333366; color: #FFFFFF; font-weight: bold; font-size: 10pt; border-top: solid 1px #3A3A4A; border-left: solid 1px #3A3A4A; border-bottom: solid 1px #090920; border-right: solid 1px #090920; } .ZWNewsFmt01-Headline {font-weight: bold; font-size: 15px; color: #FFFFFF} .ZWNewsFmt01-Byline {font-size: 11px; color: #DDD6D0} .ZWNewsFmt01-Body {font-size: 10pt; color: #FFFFFF} .purplehdrold {font-family: Verdana, sans-serif; font-size: 18px; color: #33CC66; font-weight: bold; font-style: italic} .purplehdr {font-family: Verdana, sans-serif; font-size: 18px; color: #4DC482; font-weight: bold; font-style: italic} .tblhdr {font-family: Verdana, sans-serif; font-size: 10pt; color: #FFFFFF; font-weight: bold; background: #666699; border-top: solid 1px #434376; border-left: solid 1px #434376; border-bottom: solid 1px #232356; border-right: solid 1px #232356;} .maintext {font-size: 10pt} .maintext1 {font-size: 15px} .maintext2 {font-size: 16px} .maintext3 {font-size: 18px} .maintext4 {font-size: 20px} .maintext5 {font-size: 19pt} .maintext6 {font-size: 28px} .maintext-1 {font-size: 12px} .maintext-2 {font-size: 11px} .caption {font-size: 11px; font-weight: bold} .maintext-3 {font-size: 8px} .maintext-4 {font-size: 10px} .code {font-family: Courier New; font-size: 10pt; color: #ADD8E6} .vbcode {font-family: Courier New; font-size: 11px; color: #ADD8E6} .codecomment {font-family: Courier New; font-size: 10pt; color: #9999FF}
Here is my troublesome code that messed my post up. H1 {font-size: 18px; font-weight: bold; color: #FFFFFF} H2 {font-size: 15px; font-weight: bold; color: #FFFFFF} H3 {font-size: 10pt; font-weight: bold; color: #FFFFFF}
.calendarhead {
font-family:tahoma,verdana, arial, sans-serif;
color:white;
font-size:13px;
font-weight:bold;
padding:6px;
background: #333366;
}
.calendar {
font-family:verdana, arial, sans-serif;
color:#B0B0B0;
background:#333344;
font-size:10px;
font-weight:normal;
padding:4px;
}
.calendarsel {
font-family:verdana, arial, sans-serif;
background:#6699cc;
font-size:13px;
font-weight:bold;
padding:4px;
}
.calendarlink {
color:white;
}
ul#tabnav {
font: bold 11px verdana, arial, sans-serif;
list-style-type: none;
padding-bottom: 24px;
border-bottom: 1px solid #333399;
margin: 0;
}
ul#tabnav li {
float: left;
height: 21px;
background-color: #20205C;
margin: 2px 2px 0 2px;
border: 1px solid #3333AD;
}
body#tab1 li.tab1, body#tab2 li.tab2, body#tab3 li.tab3, body#tab4 li.tab4 {
border-bottom: 1px solid #333399;
background-color: #333399;
}
body#tab1 li.tab1 a, body#tab2 li.tab2 a, body#tab3 li.tab3 a, body#tab4 li.tab4 a {
color: white;
}
#tabnav a {
float: left;
display: block;
color: #a09dc3;
text-decoration: none;
padding: 4px;
}
#tabnav a:hover {
background: #5555DD;
color: white;
}
This topic is closed to new replies.
Advertisement
Popular Topics
Advertisement