WinFuture-Forum.de: Wie: Rahmen Mit Abgerundeten Ecken Und Bildunterschrift? - WinFuture-Forum.de

Zum Inhalt wechseln

Nachrichten zum Thema: Entwicklung
Seite 1 von 1

Wie: Rahmen Mit Abgerundeten Ecken Und Bildunterschrift? Bilder oder Videos einfügen und automatisch Style zuordnen


#1 Mitglied ist offline   CrazyLexx 

  • Gruppe: aktive Mitglieder
  • Beiträge: 337
  • Beigetreten: 20. Januar 05
  • Reputation: 0

geschrieben 15. Februar 2010 - 22:07

Gibt es eigene Möglichkeit, bei WordPress Bilder in den Fließtext einzufügen und diesem dann automatisch einen CSS-definierten Style hinzufügen?

Auf dieser Seite (Beispiel) kann man ganz gut sehen, wie dem eingefügtem Video ein Rahmen mit abgerundeten Ecken sowie eine Fläche für Bildunterschriften hinzugefügt worden ist.

Gibt es für WordPress eine Lösung, sowas für in den Fließtext eingefügte Bilder und Videos zu automatisieren? Stelle es mir so vor, dass man ein Bild einfügt und anschließend den Style sowie die Bildunterschrift als Vorlage auswählen kann.

Jemand einen Vorschlag für mich oder sowas schon mal selbst verwendet?
0

Anzeige



#2 Mitglied ist offline   Ludacris 

  • Gruppe: Moderation
  • Beiträge: 4.689
  • Beigetreten: 28. Mai 06
  • Reputation: 218
  • Geschlecht:Männlich

geschrieben 16. Februar 2010 - 08:14

das problem bei abgerundeten ecken in css ist, dass der IE in keiner version und opera, safari und webkit es nur in der aktuellsten version unterstützen...

wie du das mit den bildern im Fließtext meinst weis ich allerdings nicht... erklär mir was du willst, dann versuch ich dir zu helfen!
0

#3 Mitglied ist offline   Witi 

  • Gruppe: aktive Mitglieder
  • Beiträge: 5.947
  • Beigetreten: 13. Dezember 04
  • Reputation: 43
  • Geschlecht:Männlich
  • Wohnort:Kingsvillage
  • Interessen:Frickeln

geschrieben 16. Februar 2010 - 09:07

border-radius gibt es erst in CSS 3: http://www.css3.info...rounded-border/
Was aber, wie Ludacris schon gesagt hat, nicht alle Browser unterstützen. IE kann nix (konnte auch noch nie was :cheers:) und FX nutzt stattdessen -moz-border-radius.
0

#4 Mitglied ist offline   Ludacris 

  • Gruppe: Moderation
  • Beiträge: 4.689
  • Beigetreten: 28. Mai 06
  • Reputation: 218
  • Geschlecht:Männlich

geschrieben 17. Februar 2010 - 12:46

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


und schon hast du einen 10 px radius bei der ebene, bei der du das angegeben hast.
0

#5 Mitglied ist offline   web189 

  • Gruppe: aktive Mitglieder
  • Beiträge: 218
  • Beigetreten: 25. September 07
  • Reputation: 0
  • Geschlecht:Männlich
  • Wohnort:Niex

geschrieben 17. Februar 2010 - 16:25

Ich verwende bereits seit einiger Zeit "border-radius". Der Befehl wird zwar nur von modernen Browsern unterstützt, hat allerdings keine Seiteneffekte - alle anderen kriegen eben die normalen Ecken. Ich finde das nicht schlimm, früher oder später werden andere Browser nachziehen (Chrome interpretiert schon länger CSS 3)

Natürlich muss das jeder für sich entscheiden, ich hab allerdings keine Lust auf unnötigen Traffic wegen zusätzlichen Grafiken (für runde ecken).
Alternativ kann man noch massenweise Divs verschachteln, funktioniert auch. Für mich jedoch ist die Zeit vorbei, in der ich mir wegen schlechten Browsern ein Bein ausreiße (zumindest für Kleinigkeiten wie runde Ecken).
0

#6 Mitglied ist offline   Tienchen 

  • Gruppe: aktive Mitglieder
  • Beiträge: 424
  • Beigetreten: 09. März 08
  • Reputation: 0
  • Geschlecht:Männlich

geschrieben 17. Februar 2010 - 19:53

Hallo1

eine Möglichkeit ist es, auf jQuery-Corner auszuweichen.
http://www.methvin.c...orner-demo.html

Der Vorteil: Ab IE6 ist das ganze in praktisch jedem gebräuchlichen Browser möglich damit, z.B. hier http://www.websiteba...lfe-projekt.php
Der nachteil: Bei deaktiviertem Javascript (was ca. 2-5% von Internetbenutzern betrifft) sieht man die Ecken leider nicht. Allerdings haben wesentlich mehr Leute Javascriptfähige Browser als Firefox / Webkit (Safari4 unter Windows z.B. mag auch die Webkit-Ecken nicht besonders).

Alternative: Das Ganze per Bildchen gemacht (in obigem Beispiel die Menü-Box rechts neben den anderen Boxen).
0

Thema verteilen:


Seite 1 von 1

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