WinFuture-Forum.de: Problem mit dem Design - WinFuture-Forum.de

Zum Inhalt wechseln

Nachrichten zum Thema: Entwicklung
  • 2 Seiten +
  • 1
  • 2

Problem mit dem Design

#16 Mitglied ist offline   mephistolino 

  • Gruppe: aktive Mitglieder
  • Beiträge: 469
  • Beigetreten: 17. September 10
  • Reputation: 36
  • Geschlecht:unbekannt

geschrieben 18. März 2014 - 15:09

aller erfolg anfang ist, sich auch selber um infos zu kümmern ;)

bitte google doch einfach mal ...

nicht falsch verstehen, aber ich bin (auch aus beruflicher erfahrung als ausbilder) immer der meinung, dass der erste schritt zum erfolg der ist, sich selber um sachen zu kümmern ;)

Dieser Beitrag wurde von mephistolino bearbeitet: 18. März 2014 - 15:16

4

Anzeige



#17 Mitglied ist offline   Goech 

  • Gruppe: Mitglieder
  • Beiträge: 13
  • Beigetreten: 18. März 14
  • Reputation: 0
  • Geschlecht:Männlich
  • Wohnort:Luxembourg

geschrieben 18. März 2014 - 15:18

Beitrag anzeigenZitat (mephistolino: 18. März 2014 - 15:09)

aller erfolg anfang ist, sich auch selber um infos zu kümmern ;)

bitte google doch einfach mal ...

nicht falsch verstehen, aber ich bin (auch aus beruflicher erfahrung als ausbilder) immer der meinung, dass der erste schritt zum erfolg der ist, sich selber um sachen zu kümmern ;)



du hast recht

war ja richtig faul von mir ;)
0

#18 Mitglied ist offline   Holger_N 

  • Gruppe: aktive Mitglieder
  • Beiträge: 5.111
  • Beigetreten: 11. September 10
  • Reputation: 458
  • Geschlecht:Männlich

geschrieben 18. März 2014 - 19:46

Beitrag anzeigenZitat (Goech: 18. März 2014 - 13:24)

ich habe das mal probiert nachzu machen
Eingefügtes Bild

wie findet ihr es ?


, also meiner Meinung ist das wirklich schlecht ....


Naja man muß das natürlich anpassen, ich meinte nur, wie das strukturell gemacht wird.
Moment ich tipp mal was.


So, müßte eigentlich funktionieren

<html>
<head>
<title>Gr&uuml;nes Dingsbums</title>

<style type="text/css">
#hauptcontainer {width:1000px; margin-left:auto; margin-right:auto; border:1px solid #aaaaaa;}
#logo {background-color:#000000; padding-top:35px;  padding-left:35px; height:65px;}
#tableiste {background-color:#000000; height:35px; text-align:right;} 
.logo1, .logo2 {font-size:36px;} .logo3 {font-size:18px;}
.gruen {color:#00ff00;}
.weiss {color:#ffffff;}
.schraeg {font-style:italic;}
.menu {display:block; height:25px; float:right; margin-left:5px; margin-right:5px; padding-left:5px; padding-right:5px; padding-top:10px;}
.hggruen {background-color:#00ff00;}

.gruenes_ding {height:45px; padding-top:10px; padding-left:35px; 

background: -webkit-linear-gradient(top, #00ff00, #00aa00);
background: -moz-linear-gradient(top, #00ff00, #00aa00);
background: -o-linear-gradient(top, #00ff00, #00aa00);
background: linear-gradient(top, #00ff00, #00aa00); }

.titel {font-size:36px; font-weight:bold;}

#inhalt { padding:25px;
background: -webkit-linear-gradient(top, #dddddd, #ffffff);
background: -moz-linear-gradient(top, #dddddd, #ffffff);
background: -o-linear-gradient(top, #dddddd, #ffffff);
background: linear-gradient(top, #dddddd, #ffffff); }

p {margin-top:0px; text-align:justify; line-height:1.6em;}

</style>

</head>
<body>

<div id="hauptcontainer">
<div id="logo">
	 <span class="logo1 gruen">Gr&uuml;nes</span><span class="logo2 weiss">Gesch&auml;ft</span><br />
	 <span class="logo3 weiss schraeg">eigentlich geht es ganz schnell</span>
</div>

<div id="tableiste">

<span class="menu weiss">&Uuml;ber Mutti</span>
<span class="menu weiss">Unter Vati</span>
<span class="menu weiss hggruen">Hinter Tante</span>
<span class="menu weiss">Kirschkuchen</span><br style="clear:both;" />

</div>

<div class="gruenes_ding">
  <span class="titel weiss">Hinter Tante</span>
</div>

<div id="inhalt">
<p>Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>

<p>Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>

<p>Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>

<p>Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>

<p>Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis.</p>

</div>

</div>

</body>
</html>



Da funktioniert natürlich jetzt kein Menü, das ist auch nur eine einzelne statische Seite, ohne jegliche Funktionen und ein reines Layoutbeispiel für einen vereinfachten Nachbau des Layouts der Beispielseite.

Dieser Beitrag wurde von Holger_N bearbeitet: 18. März 2014 - 20:11

Bauernregel: Regnets mächtig im April, passiert irgendwas, was sich auf April reimt.
0

#19 Mitglied ist offline   Sturmovik 

  • Gruppe: aktive Mitglieder
  • Beiträge: 3.776
  • Beigetreten: 10. Januar 08
  • Reputation: 445
  • Geschlecht:unbekannt
  • Wohnort:In Reichweite der Kaffeemaschine
  • Interessen:IT, Luftfahrt, historische Technik

geschrieben 18. März 2014 - 19:58

Beitrag anzeigenZitat (mephistolino: 18. März 2014 - 15:09)

aller erfolg anfang ist, sich auch selber um infos zu kümmern ;)

bitte google doch einfach mal ...

nicht falsch verstehen, aber ich bin (auch aus beruflicher erfahrung als ausbilder) immer der meinung, dass der erste schritt zum erfolg der ist, sich selber um sachen zu kümmern ;)


Das kann ich als multipler Autodidakt nur bestätigen.
Wenn einem alles nur vorgekaut wird, lernt man nix.
Selber essen macht fett, selber denken macht schlau.

Tutorials, Howtos und ähnliches sind zwar ne feine Sache, aber entweder setzen die gewisse Grundkenntnisse voraus (wenn man denen einfach Schritt für Schritt folgt, funktionierts zwar manchmal, aber keiner weiß warum(nicht)) oder das Thema ist so einfach, dass man sich das mit etwas Hirnanstrengung selbst hätte erarbeiten können.

Wenn du Programmieren lernen willst, fang klein an. Ein Browsergame ist schon ein recht großes Vorhaben, was schnell für Frust sorgt und dann abgebrochen wird.
«Geschichte wiederholt sich nicht, aber sie reimt sich» (Mark Twain)

Unix won't hold your hand. You wanna shoot your foot, Unix reliably delivers the shot.

True Cloudstorage
1

#20 Mitglied ist offline   Goech 

  • Gruppe: Mitglieder
  • Beiträge: 13
  • Beigetreten: 18. März 14
  • Reputation: 0
  • Geschlecht:Männlich
  • Wohnort:Luxembourg

geschrieben 19. März 2014 - 10:28

Beitrag anzeigenZitat (Sturmovik: 18. März 2014 - 19:58)

Das kann ich als multipler Autodidakt nur bestätigen.
Wenn einem alles nur vorgekaut wird, lernt man nix.
Selber essen macht fett, selber denken macht schlau.

Tutorials, Howtos und ähnliches sind zwar ne feine Sache, aber entweder setzen die gewisse Grundkenntnisse voraus (wenn man denen einfach Schritt für Schritt folgt, funktionierts zwar manchmal, aber keiner weiß warum(nicht)) oder das Thema ist so einfach, dass man sich das mit etwas Hirnanstrengung selbst hätte erarbeiten können.

Wenn du Programmieren lernen willst, fang klein an. Ein Browsergame ist schon ein recht großes Vorhaben, was schnell für Frust sorgt und dann abgebrochen wird.



ich weiss dass das viel Arbeit ist, aber ich schlage mich tod, in der Zeit wo ich keine Ahnung habe was ich programmieren sollte ....

Ich glaube,wie ja auch schon bestätigt, wird das viel Arbeit, d.h. etwas zu tun in der Freizeit... ;)



MFG

Beitrag anzeigenZitat (Holger_N: 18. März 2014 - 19:46)

Naja man muß das natürlich anpassen, ich meinte nur, wie das strukturell gemacht wird.
Moment ich tipp mal was.


So, müßte eigentlich funktionieren


Da funktioniert natürlich jetzt kein Menü, das ist auch nur eine einzelne statische Seite, ohne jegliche Funktionen und ein reines Layoutbeispiel für einen vereinfachten Nachbau des Layouts der Beispielseite.





wow *_*, das wäre wirklich Perfekt, wo ist der Unterschied, was hast du noch hinzugefügt ?

Dieser Beitrag wurde von Windows 8 User bearbeitet: 19. März 2014 - 14:08
Änderungsgrund: Zitat gekürzt.

0

#21 Mitglied ist offline   nobody is perfect 

  • Gruppe: VIP Mitglieder
  • Beiträge: 5.724
  • Beigetreten: 13. Oktober 06
  • Reputation: 315
  • Geschlecht:Männlich
  • Wohnort:Köln

geschrieben 19. März 2014 - 10:32

Beitrag anzeigenZitat (Goech: 19. März 2014 - 10:28)



wow *_*, das wäre wirklich Perfekt, wo ist der Unterschied, was hast du noch hinzugefügt ?

mephistolino Beitrag sag doch alles aus

Problem mit dem Design
0

#22 Mitglied ist offline   Goech 

  • Gruppe: Mitglieder
  • Beiträge: 13
  • Beigetreten: 18. März 14
  • Reputation: 0
  • Geschlecht:Männlich
  • Wohnort:Luxembourg

geschrieben 19. März 2014 - 10:36

Beitrag anzeigenZitat (nobody is perfect: 19. März 2014 - 10:32)

mephistolino Beitrag sag doch alles aus

Problem mit dem Design



ich habe damit das Layout gemeint, der mephistolino hat mir erklärt welche Sprachen in Gebrauch kommen
0

#23 Mitglied ist offline   Holger_N 

  • Gruppe: aktive Mitglieder
  • Beiträge: 5.111
  • Beigetreten: 11. September 10
  • Reputation: 458
  • Geschlecht:Männlich

geschrieben 19. März 2014 - 10:56

Beitrag anzeigenZitat (Goech: 19. März 2014 - 10:28)



wow *_*, das wäre wirklich Perfekt, wo ist der Unterschied, was hast du noch hinzugefügt ?



Na der komplette Quelltext steht ja da. Man muß "nur" Größen und Farben angeben und wie was woran ausgerichtet sein soll. Du schriebst ja, dass du "<div> mit CSS sowie <span>" bereits kannst und mehr ist es ja im Prinzip auch nicht, was ich benutzt habe.
Bauernregel: Regnets mächtig im April, passiert irgendwas, was sich auf April reimt.
0

#24 Mitglied ist offline   Goech 

  • Gruppe: Mitglieder
  • Beiträge: 13
  • Beigetreten: 18. März 14
  • Reputation: 0
  • Geschlecht:Männlich
  • Wohnort:Luxembourg

geschrieben 19. März 2014 - 10:57

Beitrag anzeigenZitat (Holger_N: 19. März 2014 - 10:56)

Na der komplette Quelltext steht ja da. Man muß "nur" Größen und Farben angeben und wie was woran ausgerichtet sein soll. Du schriebst ja, dass du "<div> mit CSS sowie <span>" bereits kannst und mehr ist es ja im Prinzip auch nicht, was ich benutzt habe.



ok, ich habe mir das mal angeschaut, dass sich die Farbe verläuft, das ist im Prinzip sehr simpel...


wo ist der Unterschied zwischen <div> und <span> ?

was ist besser class benutzen oder id ?


MFG
0

#25 Mitglied ist offline   Holger_N 

  • Gruppe: aktive Mitglieder
  • Beiträge: 5.111
  • Beigetreten: 11. September 10
  • Reputation: 458
  • Geschlecht:Männlich

geschrieben 19. März 2014 - 11:53

div ist ein Block-Element, damit kann man zum Beispiel Rechtecke "basteln" und Positionieren um eine Struktur zu erzeugen. span ist ein Inline-Element, das macht eher Sinn, um Textpassagen zu beeinflussen. id und class verwendet man in unterschiedlichen Situationen. Eine id vergibt man einem Element, dass man eindeutig kennzeichnen möchte, zum Beispiel die speziellen DIV-Container für den Kopf oder den Inhalt. Eine id darf auch nur einmal auf der Seite vorkommen. class kann dagegen mehrfach vorkommen und ich benutze das so, dass ich zum Beispiel eine Klasse ".gruen" anlege und lege ich fest, die hat die Schriftfarbe grün und alles was an Schrift grün sein soll kriegt dann die Klasse .gruen zugewiesen.

Wie man das anwendet, steht aber jedem frei. Man kann eine Klasse definieren:

.absatz {font-weight:bold; color:#00ff00;}

<p class="absatz">Dicke gruene Schrift</p>

oder man macht sich zwei allgemeine Klassen

.fett {font-weight:bold;}
.gruen {color:#00ff00;}

<p class="gruen fett">Dicke gruene Schrift</p>

Das hat das gleiche Ergebnis aber im zweiten Beispiel kann man die Klasse .fett auch für Schrift benutzen, die nicht grün ist und die Klasse .gruen auch für Schriften, die nicht fett sind.

Was praktischer ist, hängt im Einzelnen vom Umfang der Seite ab und wie flexibel man mit den Eigenschaften sein muß.
Bauernregel: Regnets mächtig im April, passiert irgendwas, was sich auf April reimt.
0

#26 Mitglied ist offline   Goech 

  • Gruppe: Mitglieder
  • Beiträge: 13
  • Beigetreten: 18. März 14
  • Reputation: 0
  • Geschlecht:Männlich
  • Wohnort:Luxembourg

geschrieben 19. März 2014 - 12:57

Beitrag anzeigenZitat (Holger_N: 19. März 2014 - 11:53)



das macht natürlich Sinn :)

Vielen Dank für die Erklärung

Dieser Beitrag wurde von Windows 8 User bearbeitet: 19. März 2014 - 14:12
Änderungsgrund: Zitat gekürzt.

0

Thema verteilen:


  • 2 Seiten +
  • 1
  • 2

1 Besucher lesen dieses Thema
Mitglieder: 0, Gäste: 1, unsichtbare Mitglieder: 0