[Thomynator]

Hey leute, ich hab mir heute nen MySpace gemacht, und gemerkt, dass ich ohne HTM/CSS kaum ein gescheides Profil hinbekomme.
Hat jemand von euch nen gutes Tutorial, wo man schnell HTML lernt?
Nehme auch gerne Tutorials an, die sich direkt auf MySpace beziehen

weil die codes immer rauszukopieren ausm Inet oder so is nich mein Stil...

Hoffe ihr könnt mir da helfen

Wie lange werde ich brauchen, bis ich halbwegs was in HTML hinbekomme?

den link bekommt ihr, wenn mir die Page gefällt xD^^

MfG

Tommy

Dieser Beitrag wurde von Thomynator bearbeitet: 28. Juni 2008 - 14:23

[MezzoX]

http://de.selfhtml.org

was besseres wirste net finden. Mit HTML was zu erstellen is realtiv simpel und "gute" ergebnisse schaffst schon nach paar Stunden oder Tagen (wirst aber oft nachschaun müssen)

[Thomynator]

vielen Dank für den Link
Möcht ja auch erst mal nur bissel anfangen...
muss ja ncih glei das überflieger Profil werden nur besser als Standard^^

MfG

Tommy

[clyde²]

So hab ich HTML gelernt, ist kostenlos

[Thomynator]

Thx...
das werd ich mir wohl auch ,mal angucken..
vielen Dank schon mal an beide...

MfG

Tommy

[Thomynator]

so leute...
meine Seite is soweit, adss ich sie zeigen kann...
woebi sie noch lange nicht fertig ist xD^^ aber das wird noch...

http://www.myspace.com/392661054

ich wäre über Meinungen und evtl. Verbesserungsvorschläge erfreut

Ach so... ich wollte meine URL ändern, aber das geht nich... kp wieso ncih... habt ihr ne idee? da steht die url kann nicht verändert werden.

MfG

Tommy

[amalbhalbe]

das dunke Grau in den Überschriftsbereichen is ein Graus. Das ergibt nen furchtbaren Kontrast zu dem blauen bg - und lesen kann mans auch nimma - eher was helles dort hin

[Thomynator]

Danke für den hinweis, werde das ändern, sobald ich ne Möglichkeite dafür gefunden habe xD^^
(muss mich da noch bissel reinfitzen was alles so zusammengehört...
kann also etwas dauern, aber thx für den tipp

So... ahb datt ma geändert, aber auf demdunklen Hintergrund sind meine Links in schwarz gehalten... wie bekomm ich die heller?
blick durch den basiscode noch net so durch

MfG

Tommy

Dieser Beitrag wurde von Thomynator bearbeitet: 30. Juni 2008 - 19:34

[ps915]

//Alle Links
a{
 color: green;
}

// erst a:link, dann a:visited, dann a:hover, dann a:active
a:link {
 color: black;
}

a:visited{
 color: red;
}

// hier für beide der gleiche Style
a:hover, a:active{
 color: yellow;
}

Dieser Beitrag wurde von Toasterfraktion bearbeitet: 01. Juli 2008 - 13:20

[Thomynator]

@ Toasterfraktion,
danke für die infos, aber ich weiß net so recht, wohin damit... hab hier mal den basiscode rauskopiert...
wär nett, wenn du mir die Stelle amrkieren könntest, wo ich das reinmachen soll... (sorry für so viel unwissenheit ... aber naja... anfänger halt^^)


<div class="coolchaser" layout=21782491>
<br> <br>
<div class="credits">
<a href="http://www.msplinks.com/MDFodHRwOi8vd3d3LnVybC5jb20vaW1hZ2UuZ2lm" title="Get your layout at CoolChaser.com"><img src="http://www.coolchaser.com/images/favicon_s.gif" border=0 style="vertical-align:text-bottom;" alt="CoolChaser.com"></a> Layout by <a href="http://www.msplinks.com/MDFodHRwOi8vdXJsLmNvbS9pbWFnZS5naWY=" target="_blank">CoolChaser</a>
</div>
<div class="cool">
<img src="http://www.coolchaser.com/images/banner_xray.gif" border="0" usemap="#bannerMap" alt="CoolChaser">
</div>

<map name="bannerMap">
<area target="_blank" href="http://www.msplinks.com/MDFodHRwOi8vd3d3LnVybC5jb20vaW1hZ2UuZ2lm" coords="0,55,55,0,153,0,0,153" shape="poly"/>
</map>

<div class="cc_banner">
</div> <style>
.r{}

body {
font-size: 1px; line-height: 1px; font-family: Verdana, Arial, sans-serif;
background-color:e5e5e5;
background-image:url(http://www.coolchase...und/view/125637);
background-attachment: fixed;
background-position:center center;
background-repeat:no-repeat;
}

.cool {
position: absolute;
left:0px;
top:0px;
width:156px;
height:154px;
z-index:8;
}

div div table div ul {
position:relative;
z-index:9;
}

div div table div ul ul {
position:static;
}

p {margin: 0px 0px 1em 0px; font-family: Verdana, sans-serif !important}

a, a:link, a:visited {color:F35485; text-decoration: none;}

a:hover {color:76996E; text-decoration: none}

img {border: none}

br {line-height: 10px;}
br + br
{
line-height:0;
}

u {text-decoration: none; }

table table table br { line-height:15px; }

* html table table table.latestBlogEntry br { line-height:0; }
.friendSpace br { line-height:0; }

form {border-width:0px;background-color:none;}

input {background-color:transparent !important}

table {border-collapse:separate;}

table, tr, td, table table, table table td {border-width:0px; background-color: transparent;}


table table table td {background-color:transparent;margin:0px;padding:0; vertical-align:top ! important;}
* html table table table td {padding: 0 12px 15px 12px;}

table table table table {border-width:0px; background-color: transparent; margin:0px; padding:0px; background-image: none;}
table table table table table{ border-color:ffffff;}

table table table table td {padding:3px 0;margin:0px; }
table table table table table td { padding:0 2px 0 0;}


table table table {
margin:0px;
max-width: 453px;
width: 100% !important;
padding: 0 12px 14px 13px;
}

* html table table table { padding:0;}

body td table, body div table {margin-top: 0;}

font {color:386093;font-size:10px}

a font:hover {color:000000}

a.navbar:link, a.navbar:visited {color:FFFFFF}

a.navbar:hover {color:CCCCCC}

table tr td table tr td font {display: inline;}

table tr td table a.navbar {font-size: 10px;}

.text {color:000000;font-size:11px}

a.text:link, a.text:visited {color:FFFFFF}

a.text:hover {color:CCCCCC}

.contactTable {width: auto !important;}

* html .contactTable, *html .userProfileURL {width: 294px !important;}

.contactTable td {padding: 0px; margin: 0px; text-align: center; }

.contactTable span.whitetext12 { left: 0;}
* html .contactTable .whitetext12 {margin-left: 25px;}

.contactTable td table {
height:150px;
background-color: transparent;
background-position: center;
background-repeat: no-repeat;
}
* html .contactTable td table {
background-position:center center;
}

.contactTable a {padding: 0px; margin: 0px 5px 1px 0px; display: block; background-color: transparent; }
.contactTable a { height: 30px; width: 134px;}
.contactTable img { display:none; visibility:hidden;}
.contactTable a img {
border: 0px;
display: block;
visibility: visible;
}

.contactTable a img { width:120px; margin-top:6px; margin-left:8px;}

.nametext, .whitetext12, .orangetext15, .btext {
margin: 14px 0px 4px 0px;
width:auto;
display: block;
}

* html .nametext, * html .whitetext12, * html table.userProfileURL strong { width:267px; }

.orangetext15, .btext {
width:auto;
}

table table table table .orangetext15 { margin-bottom:4px;}

* html .orangetext15, * html .btext { width:390px;}

table tr td table tr td table tr td div strong {display: block; width: 270px;}

.whitetext12 { margin-top:0;}
.blacktext12 { display: block; margin-bottom:0px !important;}
.NOTES { content:"view all of your friend's link"; }

a.redlink:link {display: block; border-width: 3px 0px 0px 0px; padding-top: 3px;}
a.redlink:active, a.redlink:visited, a.redlink:link { display:inline; }

.NOTES { content:"firefox hack to make tables not to have a huge gap"; }
td.text {text-align:left;}


table table tr td {
line-height:1.4em;
}

table.userProfileURL strong { margin-top:-5px; margin-right:8px !important; }
table.userProfileURL { text-align:center;}
table.userProfileURL table {margin-top:-7px; margin-right:-5px;}
table table table.userProfileURL {padding-bottom:0;}
*html table table table.userProfileURL td {padding-bottom: 0;}


table.userProfileDetail .whitetext12, table.contactTable .whitetext12{ margin-top:3px;}
table table table.blurbs span.orangetext15, table table table.friendSpace .orangetext15 { display:none; }
table table table.blurbs table {margin-top:-18px;}
table table table.blurbs table table { margin:0; width:auto !important; padding:0;}
table table table.blurbs table span.orangetext15 { display:block; margin-bottom:0px;}

table table table.extendedNetwork { padding:0; }

table table table.extendedNetwork td { height:75px; padding:0;}

table table table.contactTable { padding:0;}
table table table.contactTable span.whitetext12{ display:none; }.contactTable .text {font-size:1px !important;}
table table table.contactTable td.text {height:0px !important}


.a {fix extended network border}
table table td.text table { border-collapse:collapse; }

td.text table.blurbs,
td.text table.latestBlogEntry,
td.text table.friendSpace,
td.text table.friendsComments,
table table td.text table table,
table.friendSpace td.text table,
table.friendsComments td.text table { border-collapse:separate; margin-top:0px; }

.a { ie fix }
* html table table td.text table td { padding:0;}
* html table table td.text table td table td { padding:0 !important;}
* html td.text table.blurbs td,
* html td.text table.latestBlogEntry td,
* html td.text table.friendSpace td,
* html td.text table.friendsComments td,
* html table.friendSpace td.text table td,
* html table.friendsComments td.text table td {
padding: 0 12px 15px 12px;
}
div table {
width:100%;
}
div table div, div table table { width:auto;}
body div table td form input.srchTextfld { width:auto !important; }
.r{}
body {
background-color:000000 !important;
}

table table table {
border-width: 4;
border-style: outset;
border-color: B90000;
background-color:transparent;
background-image:url(http://i152.photobuc...uggin/red84.jpg);


filter:alpha(opacity=100);
-moz-opacity:1;
opacity:1;
-khtml-opacity:1;












}


table table table table {filter:none !important; opacity:1 !important; }

.NOTES { contact table if necessary }

.contactTable {


}

.contactTable td table {
background-image: url(http://i152.photobuc...tacttable-1.jpg);


}

.contactTable a img, .contactTable img {
visibility: hidden;
}


.NOTES { Text Style }

body, table table tr td, table table div, li, p, .redtext, .blacktext10, .text, a.text:link, a.text:visited,
a.searchlinksmall, a.searchlinksmall:link, a.searchlinksmall:visited,
.lightbluetext8, a, a:link, a:visited, a.redlink:link, div, font, a.navbar:link, a.navbar:visited
{
color:FFFFFF;
font-family:Lucida Sans Unicode, Lucida Grande, sans-serif !important;
font-size:11;

font-weight:bold;



text-transform:none;
}

a.searchlinksmall, a.searchlinksmall:link, a.searchlinksmall:visited { font-weight:normal;}

.NOTES { header colors and fonts }

.nametext, .whitetext12, .orangetext15, .btext, .redbtext, .blacktext12, table.userProfileURL strong {
margin: 14px 0px 4px 0px;
color:FFFFFF;
font-size:14;
font-family:Trebuchet MS, Helvetica, sans-serif;
font-style:normal;
font-weight:bold;


text-transform:uppercase;
text-align: center;
}

.whitetext12 { margin-top:0; }

.NOTES { network graphic if necessary }

.a {fix extended network border}
table table td.text table {


}

td.text table.blurbs,
td.text table.latestBlogEntry,
td.text table.friendSpace,
td.text table.friendsComments,
table.friendSpace,
table.friendsComments
{
background-color:transparent;
background-image:url(http://i152.photobuc...uggin/red84.jpg);
background-position:top left;

background-repeat:repeat;

filter:alpha(opacity=100);
-moz-opacity:1;
opacity:1;
-khtml-opacity:1;
}

table table td.text table table,
table.friendSpace td.text table,
table.friendsComments td.text table {
background:transparent;
}


span.blacktext12 {
background-image: url();


height: 483;









padding-top: 18;

padding-bottom:;


}

.blacktext12 { text-align:center; margin-top:0px;}

.nametext, .whitetext12, .orangetext15, .btext, table.userProfileURL strong {
background-color:000000;



border-width: 2;
border-style: outset;













}

.nametext {

font-size:14;
font-family:Lucida Sans Unicode, Lucida Grande, sans-serif;

font-weight:bold;




background-color:;


















}

.NOTES { details heading color }
.lightbluetext8 {
color:FFFFFF;
font-size:11;
font-family:Lucida Sans Unicode, Lucida Grande, sans-serif;

font-weight:bold;



}

.NOTES { Link Style }

a, a:link, a:visited, a.redlink:link, a.redlink:visited, a.navbar:link, a.navbar:visited, a.text:link, a.text:visited, a.text:hover {
color:000000;
font-size:10;
font-family:Lucida Sans Unicode, Lucida Grande, sans-serif;

font-weight:bold;

text-decoration:underline;

}

a.navbar:link, a.navbar:visited, a.text:link, a.text:visited, a.text:hover {

}

a:hover, a.redlink:hover, a.navbar:hover, a.text:hover {
color:EB0000;
font-size:10;


font-weight:bold;

text-decoration:none;

}

a.navbar:hover, a.text:hover {

}

.NOTES { content:'make font smaller for friends comments box';}
a.navbar:link, a.navbar:visited, a.navbar:hover, a.text:link, a.text:visited, a.text:hover { font-weight:normal; font-size:9px;}

*html table table table { height: .01%; }

.cc_banner {



















filter:alpha(opacity=100);
-moz-opacity:1;
opacity:1;
-khtml-opacity:1;

width:751px;

margin-left:-365px;

left:50%;
position:absolute;
top:165px;
}

* html .cc_banner {
width:751px;
margin-left:-365px;
}

body table {


}

* html body table {

}

body td table, body div table {
margin-top: 0;
}



.nametext, .whitetext12, .orangetext15, .btext, table.userProfileURL strong {
padding-top: 2;
padding-right:0;
padding-bottom:2;
padding-left:0;
padding-left: 0;
}

.nametext {




}





</style>

<style>
body {
background-color:000000 !important;
}
body {
background-repeat: </ph>

Dieser Beitrag wurde von Thomynator bearbeitet: 02. Juli 2008 - 20:12

[ps915]

Wow langer Code, mach den mal am besten in eine Codebox -> [c#debox]muh[/c#debox] # = o ;-P
Also da muss ich mich erstmal einlesen. Ist das Original von MySpace der Code? Oder hast du das schon aus einem "Skin" rauskopiert. Ich habe noch nie so einen unübersichtlichen Stylesheet gesehen. Das hat mit Leerzeichen. Für mich sieht das so aus als ob das kein Mensch geschrieben hat, oder? Gibt’s da bei MySpace eventuell einen "Editor"?

Ich habe es wirklich versucht. Ich empfehle dir wirklich deine Seite komplett neu zu gestalten. Mach den Standard "Skin" rein, dann werd ich dir auch helfen deine wünsche umzusetzen. Dann wirst du auch noch CSS lernen. Css ist nicht schwer, man muss nur das Prinzip verstanden haben, aber wenn ich als Anfänger mich in seinem Klotz zurechtfinden muss würde ich sicherlich scheitern.

Also entweder du suchst dir die Farbwerte im Quelltext heraus und änderst sie oder du machst ihn einfach komplett neu.

Gruß,
Toasterfraktion

Dieser Beitrag wurde von Toasterfraktion bearbeitet: 01. Juli 2008 - 20:04

[Thomynator]

Also... Mein Layout habe ich von dieser Seite hier: http://www.coolchaser.com/
... keine Ahnung wer das geschrieben hat xD...
kannst mih ja heute mal im ICQ deswegen anschreiben ... nr is im Profile^^

MfG

Tommy

[ps915]

Hm jop aber schreib du mich mal lieber an sonst vergess ich das wieder! ^^

[Erte]

Mach dir doch ne seperate CSS Datei. Mache ich auch so, und ist meiner Meinung nach viel übersichtlicher.

Dieser Beitrag wurde von Erte bearbeitet: 02. Juli 2008 - 12:44

[Thomynator]

Sorry Toasterfraktion, wird bei mir heute und morgen erst mal nichts werden...

@ Erte...
wie meinst du das?
ich kann kein CSS... noch ncih^^

MfG

Tommy