Bilder mit mehr als 4 Ecken
paul
- multimedia (audio & video)
Moin,
Hintergrund: ich habe ein Bild welches einen transparenten Hintergrund hat. Für das Bild habe ich float:left angegeben. Dadurch wird der Text schön um das Bild herum geschrieben. So weit, so gut. Nun ist der transparente Hintergund allerdings in einigen Bereichen des Bildes sehr groß.
Frage: Gibt es eine Möglichkeit das rechteckige Bild in ein Polygon zu konvertieren? Natürlich ist das dann kein Bild mehr sondern ... was anderes.
Paul
Hallo,
Hintergrund: ich habe ein Bild welches einen transparenten Hintergrund hat. Für das Bild habe ich float:left angegeben. Dadurch wird der Text schön um das Bild herum geschrieben. So weit, so gut. Nun ist der transparente Hintergund allerdings in einigen Bereichen des Bildes sehr groß.
... und nun möchtest du, dass der Text nicht die Außenkanten des Bildes umfließt, sondern die Konturen des Motivs? - Das geht so nicht.
Ich habe allerdings schon ab und zu als Behelfslösung (auf neudeutsch: Workaround) gesehen, dass das Bild in Streifen zerlegt wurde, jeder Streifen nur wenig breiter als das eigentliche Motiv. Das ist ein ziemlicher Aufwand, aber wenn's einem der Effekt wert ist ...
So long,
Martin
Hallo,
... und nun möchtest du, dass der Text nicht die Außenkanten des Bildes umfließt, sondern die Konturen des Motivs? - Das geht so nicht.
Ich habe allerdings schon ab und zu als Behelfslösung (auf neudeutsch: Workaround) gesehen, dass das Bild in Streifen zerlegt wurde, jeder Streifen nur wenig breiter als das eigentliche Motiv. Das ist ein ziemlicher Aufwand, aber wenn's einem der Effekt wert ist ...
Ich denke, das Bild kann ganz bleiben. Man muss es nur absolut positionieren (damit der folgende Text das Bild überschreibt) und dann leere Blockelemente definieren, um die der Text herumfließt.
LG Kalle
... Man muss es nur absolut positionieren (damit der folgende Text das Bild überschreibt)
Oder margin-bottom des Bildes negativ setzen, ist wohl noch einfacher.
... Man muss es nur absolut positionieren (damit der folgende Text das Bild überschreibt)
Oder margin-bottom des Bildes negativ setzen, ist wohl noch einfacher.
Was? Verstehe nur Bahnhof...
Hi paul,
falls du des Englischen einigermaßen mächtig bist und dir PHP zur Verfügung steht, könnte dieser Artikel dir evtl. eine Hilfe sein: Sliced and Diced Sandbags.
cheers
Antipitch
Ja, sehr schön.
Allerdings etwas zu überdimensioniert für meine Bedürfnisse. Aber sehr interessant für weitere stylische Aktivitäten.
Paul
Ich denke, das Bild kann ganz bleiben. Man muss es nur absolut positionieren (damit der folgende Text das Bild überschreibt) und dann leere Blockelemente definieren, um die der Text herumfließt.
Hmmm - beim nochmaligen Nachdenken ... Wenn ich Blockelemente mit float aneinanderreihe, belegen sie den Platz, den eigentlich der Text haben soll. Wie bekomme ich Blockelemente untereinander, den Fließtext aber daneben?
LG Kalle
Hi,
Ich habe allerdings schon ab und zu als Behelfslösung (auf neudeutsch: Workaround) gesehen, dass das Bild in Streifen zerlegt wurde, jeder Streifen nur wenig breiter als das eigentliche Motiv. Das ist ein ziemlicher Aufwand, aber wenn's einem der Effekt wert ist ...
Mit Gimp geht das relativ einfach, wenn Du regelmäßige horizontale Hilfslinien ziehst und mit dem Werkzeug Guillotine das Bild schnipselst, brauchst Du nur noch die Streifen, die zu breit sind, verschmalern.
Gruß, LX
Mit Gimp geht das relativ einfach, wenn Du regelmäßige horizontale Hilfslinien ziehst und mit dem Werkzeug Guillotine das Bild schnipselst, brauchst Du nur noch die Streifen, die zu breit sind, verschmalern.
Das hört sich gut an. Habe aber gerade auf die Schnelle keine Hilfslinien erzeugen können. Wie macht man das (oder muss man die per Hand reinmalen)?
Hi!
Das hört sich gut an. Habe aber gerade auf die Schnelle keine Hilfslinien erzeugen können. Wie macht man das (oder muss man die per Hand reinmalen)?
Du ziehst sie vom Seitenlineal dorthin, wo Du sie haben willst.
Dummerweise hat mein siebaehnliches Gedaechtnis mal wieder verschlampt, wo ich grad neulich eine Loesung fuer genau so ein Problem gefunden hatte. Sonst wuerde ich Dir von der Bildmisshandlung abraten.
Ich bilde mir allerdings ein, dass ein Website Baker Template genau so ein Feature hatte. Da kann ich allerdings grad nicht nach suchen.
Entweder von Hand per drag+drop aus dem Lineal "herausziehen" oder auch mit Script-Fu etwas machen, aber ich fürchte, das wird leider recht kompliziert.
Gruß, LX
Hallo paul
Frage: Gibt es eine Möglichkeit das rechteckige Bild in ein Polygon zu konvertieren? Natürlich ist das dann kein Bild mehr sondern ... was anderes.
Nein diese Möglichkeit gibt es nicht. Du kannst dich aber behelfen (Beispiel):
#MyId {
position:relative;
}
#MyId img {
position:absolute;
top:0;
left:0;
}
#MyId span {
float:left;
clear:left;
height:18px;
}
<p Id="MyId">
<img src="grafik.png" alt="Grafik">
<span style="width:125px;"></span>
<span style="width:135px;"></span>
<span style="width:145px;"></span>
<span style="width:155px;"></span>
…
</p>
Hierbei werden ausnahmsweise Inlinestyles verwendet, weil eigene Ids für jedes <span> den Code auch nicht einfacher oder übersichtliche machen würden. Wie viele <span>s benötigt werden und mit welchen Maßen es bei dir passt, kannst du nur testen.
Auf Wiederlesen
Detlef
Zur Ergänzung noch ein paar Links zu Eric Meyer:
slantastic - Weihnachtsbaum - curvelicious
mfg Thomas