Rand eines objektes

  • Hallo Alle
    Ich habe folgendes Problem:
    Ich habe ein Css Objekt ganz normal erstellt und es sieht auch ganz normal aus aber ich wollte lieber dass sich die Farbe des Roten Objektes sich in den Blauen Hintergrund einmischt also eine Art Übergang und die oberen 2 Ecken sollen Rund sein!
    Hab schon über all geschaut aber es stand nie da.
    Danke schonmal im voraus
    Truck007

  • Öhm.. naja, dass ist wirklich nicht besonders einfach^^


    Naja, das Abrunden der Ecken schaffst du mit CSS3:

    Code
    -webkit-border-radius: 10px 10px 0 0;
       -moz-border-radius: 10px 10px 0 0;
            border-radius: 10px 10px 0 0;

    Das versteht aber leider noch nicht jeder Browser.. :/


    Den Farbübergang schaffst du theorethisch nur mit Hintergrundbildern^^
    Beziehungsweise mit CSS3, border-images^^ (Wo wieder das Problem ist, dass das nicht jeder Browser versteht^^)
    Auch wäre es möglich mit der CSS3-Eigenschaft box-shadow zu spielen^^

  • Jein.. also entweder via CSS3 oder eben mit einem Box-verschatelung:

    Code
    _______
    [ ]_______[ ]
    |¯| T     |¯|
    | |  E    | |
    | |   x   | |
    | |____t__| |
    [¯]_______[¯]

    (Ich hoffe es ist erkenntlich, was ich meine..^^)

  • css3 fügt man nicht ein :) Du verwendest ja auch css2 ohne das du es merkst :wink:
    Es ist quasi eine Sammlung von Eigenschaften.
    Man verwendet Sie einfach und wenn ein Browser diese Eigenschaft kennt, wendet er diese an, andernfalls ignoriert er diese.


    Den Strich unter einem Link bekommt man einfach weg, in dem man <a> irgendwie anwählt und anschließend diesem ein text-decoration: none; gibt :) Bsp.:

    Code
    ul a {
        text-decoration: none;
    }
  • ok danke das mit den strich hat funktioniert aber das mit eigenschaft ich hab das noch nie gemacht benutze immer das normale CSS und weis ü. nicht wies geht
    muss mann das mit ins Css dokument schreiben od. nicht?

  • ...ohne das du es merkst verwendest du css2 :P
    Du verwendest ja auch html4-Objekte ohne das du es wirklich weist :D
    Das sind einfach nur die verschiedenen Versionen von den Sprachen, du selber musst da eigentlich nichts machen. Du schreibst Sie einfach in eine Datei, fertig.


    Kleines Beispiel:
    .classByMe oder #meineId gibt es auch erst seit CSS2 und du kannst es einfach verwenden, ohne dass du groß jemals etwas eingestellt hast, oder? :wink:

  • Code
    border-radius: [Abrundung oben Links] [Abrundung oben Rechts] [Abrundung unten Rechts] [Abrundung unten Links];

    oder wenn alle die Selbe Abrundung haben sollen:

    Code
    border-radius: [Wert für alle Ecken];

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!