Ergebnis 1 bis 6 von 6

Thema: Box-Ansicht

  1. #1
    HTML Newbie
    Registriert seit
    28.11.2013
    Beiträge
    3
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard Box-Ansicht

    Guten Morgen,

    ich hänge im Moment an einem für euch wahrscheinlich ziemlich simplen Fall fest.
    Ich möchte gerne Boxen wie diese erstellen können: (hab sie hier einmal aufgezeichnet)

    20131128_084242.jpg

    In der mittleren runden Box soll ein Logo kommen.
    In den äußeren 4 Boxen soll Text stehen.

    Wäre sehr froh, wenn mir jemand helfen könnte bzw. eine Vorlage hätte.

    Freundliche Grüße
    Jan
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Prinz(essin)
    Registriert seit
    26.03.2013
    Beiträge
    835
    Danke
    20
    Bekam 76 mal "Danke" in 75 Postings

    Standard AW: Box-Ansicht

    Wir schreiben dir hier keinen Code, der Ansatz muss von dir kommen. Wenn du so überhaupt keine Ahnung hast, empfehle ich mit kleinen Dingen zu beginnen und ein Tutorial zum Einstieg.

  3. #3
    HTML Newbie
    Themenstarter

    Registriert seit
    28.11.2013
    Beiträge
    3
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Box-Ansicht

    Klar, wäre natürlich zu viel verlangt, mal einen Ansatz zu posten, wie es möglich ist die Form von Boxen zu ändern.
    Außerdem ist es natürlich unüblich in einem Forum, welches "Forum-Hilfe" heißt im Unterforum "HTML & CSS" Code zu schreiben.

    Fragt man nach, wie eine Box so eine Form wie dargestellt bekommt, hat man natürlich so gar keine Ahnung und sollte erstmal mit kleinen Dingen anfangen. Seitdem du HTML schreibst, hast du bestimmt nie mehr an irgendeiner Stelle einen Hänger gehabt oder?! Und wenn doch, bist du mit HTML nochmal ganz von vorne angefangen....

    Danke für die Hilfe, weil ich jetzt an einer Box nicht weitergekommen bin, werde ich natürlich deinen Rat befolgen. Werde nochmal ganz von vorne Anfangen mit meiner Ausbildung.

    Freundliche Grüße
    Jan

  4. #4
    Prinz(essin)
    Registriert seit
    26.03.2013
    Beiträge
    835
    Danke
    20
    Bekam 76 mal "Danke" in 75 Postings

    Standard AW: Box-Ansicht

    Ich wusste ja nicht das du gar keine Ahnung hast. Boxen sind immer viereckig in HTML. Grafische Dinge wie von dir dargestellt müssen als Bild implentiert werden.

    Die Grundlagen sollte man schon mal lernen, das kann ein Forum nicht leisten.
    http://www.peterkropff.de/site/html/html.htm
    http://little-boxes.de/little-boxes-teil1-online.html
    http://webkompetenz.wikidot.com/docs:html-handbuch

  5. #5
    HTML Newbie
    Themenstarter

    Registriert seit
    28.11.2013
    Beiträge
    3
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard AW: Box-Ansicht

    -Gelöscht-
    Geändert von novolov (28.11.2013 um 15:54 Uhr)

  6. #6
    Meister(in) Avatar von lukasn
    Registriert seit
    23.02.2008
    Ort
    Schweiz
    Alter
    27
    Beiträge
    491
    Danke
    2
    Bekam 12 mal "Danke" in 11 Postings

    Standard AW: Box-Ansicht

    Wie explanator schon gesagt hat, ist es nicht möglich, die rechteckige Form von HTML-Boxen zu ändern. Was du aber machen könntest wäre die mittlere runde Box mithilfe eines border-radius zu einem Kreis zu machen. Dabei musst du allerdings beachten, dass Text in den 4 eckigen Boxen hinter den Kreis gehen kann, das müsstest du also noch irgendwie sonst verhindern, z.B. durch eine gefloatete box innerhalb der jeweiligen Section.

    Beispielcode:

    CSS
    Code:
    .wrapper {    height: 420px;
        width: 820px;
        position: relative;
    }
    
    
    .round {
        height: 200px;
        width: 200px;
        position: absolute;
        top: 90px;
        left: 290px;
        border: 20px solid white;
        border-radius: 50%;
        background: #444;
    }
    
    
    .wrapper > section {
        width: 400px;
        height: 200px;
        margin: 0 20px 20px 0;
        background: #aaa;
        position: absolute;
    }
    
    
    #one {
        top: 0;
        left: 0;
    }
    
    
    #two {
        top: 0;
        left: 420px;
    }
    
    
    #three {
        top: 220px;
        left: 0;
    }
    
    
    #four {
        top: 220px;
        left: 420px;
    }
    HTML
    HTML-Code:
    <div class="wrapper">
    	<section id="one"></section>
    	<section id="two"></section>
    	<section id="three"></section>
    	<section id="four"></section>
    	<div class="round"></div>
    </div>

Ähnliche Themen

  1. von einer FRAME Ansicht zu einer Normalen Ansicht springen
    Von Unregistriert im Forum HTML & CSS Forum
    Antworten: 6
    Letzter Beitrag: 02.05.2011, 16:13
  2. Code-Ansicht
    Von sashs im Forum Zope & Plone - das deutsche Hilfeforum
    Antworten: 6
    Letzter Beitrag: 16.02.2009, 16:36
  3. Ansicht in der Taskleiste...
    Von driver im Forum Computer - Internet Forum
    Antworten: 8
    Letzter Beitrag: 05.11.2007, 19:27
  4. 360 grad ansicht
    Von Gast Joe im Forum Flash Forum
    Antworten: 16
    Letzter Beitrag: 06.01.2007, 17:28
  5. filzilla - ansicht
    Von phore im Forum Computer - Internet Forum
    Antworten: 5
    Letzter Beitrag: 23.08.2005, 19:51

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •