art-d-sign
-


Hinweise


Antwort
 
LinkBack Themen-Optionen Thema durchsuchen Thema bewerten
Alt 11.08.2008, 22:38   #1
TP-Junior
 
Registriert seit: Aug 2008
Ort: Düsseldorf
dozent macht alles soweit korrekt

Text umfließt Bild


Ich möchte gerne in einer Zelle ein Bild platzieren und von Text (im von mir festzulegenden Abstand) umfließen lassen.

Leider bin ich bislang nur dazu gekommen, dass das erste Wort neben dem Bild steht, der folgende Text dann wieder darunter platziert wird.

Freue mich auf jede praktikable und leicht verständliche Lösung. Danke!
dozent ist offline   Mit Zitat antworten


Alt 11.08.2008, 22:55   #2
TP-Moderator
 
Benutzerbild von Rizzo
 
Registriert seit: Aug 2004
Ort: Kaiserslautern
Rizzo lebt für das TP und seine UserRizzo lebt für das TP und seine UserRizzo lebt für das TP und seine UserRizzo lebt für das TP und seine UserRizzo lebt für das TP und seine UserRizzo lebt für das TP und seine UserRizzo lebt für das TP und seine UserRizzo lebt für das TP und seine UserRizzo lebt für das TP und seine User
Hallo dozent,

das geht zum einen mit CSS oder aber auch im img-Tag direkt. Beispiel:
HTML-Code:
<img src="apfelbaum.jpg" alt="Apfelbaum" align="right" vspace="5" hspace="3" />
Da würde das Bild rechts ausrichten und die Abstände werden mit vspace (vertical space = oben und unten) und hspace (horizontal space = links und rechts) in Pixel angegeben. Bisschen Info dazu.

Der bevorzugte Weg ist aber CSS. Hier ist float und margin dein Freund.
Rizzo ist offline   Mit Zitat antworten
Alt 11.08.2008, 23:03   #3
TP-Junior
 
Registriert seit: Aug 2008
Ort: Düsseldorf
dozent macht alles soweit korrekt
Lieber Andreas,

so richtig habe ich das noch nicht verstanden - ein bisschen zu fachspezifisch für mich, glaube ich - aber ich werde damit herumexperimentieren. In diesem Sinne also: Herzlichen Dank für rasche Hilfe :-)

Herzliche Grüße,


Michael
dozent ist offline   Mit Zitat antworten
Alt 11.08.2008, 23:28   #4
TP-Insider
 
Benutzerbild von paby
 
Registriert seit: Sep 2002
Ort: bayern
paby ist ein richtiges Arbeitstier - DANKEpaby ist ein richtiges Arbeitstier - DANKEpaby ist ein richtiges Arbeitstier - DANKEpaby ist ein richtiges Arbeitstier - DANKEpaby ist ein richtiges Arbeitstier - DANKE
dat ist nicht schwer...
schnapp dir den schnipsel - und ändere einfach mal lustig drauf los
mach aus right einfach mal left und guck was passiert
ändere mal die space-werte und schau was passiert

dat wird schon...

have fun - paby
__________________
das böse im web: ein tatsachenbericht
psst...:ich benutze nof
und jetzt blogge ich auch bis(s)chen
paby ist offline   Mit Zitat antworten
Alt 11.08.2008, 23:34   #5
TP-Junior
 
Registriert seit: Aug 2008
Ort: Düsseldorf
dozent macht alles soweit korrekt
So habe ich's wohl gemacht :-)

Jetzt habe ich den Text neben dem Bild stehen, und das ist wunderbar. Leider läuft die erste Zeile jetzt durch das Bild (bei der img-Lösung) :-(

Mit fun hat das leider am dritten Versuchstag nicht mehr viel zu tun. Also, wenn Du da noch einen entscheidenden Tipp hast...
dozent ist offline   Mit Zitat antworten
Alt 11.08.2008, 23:52   #6
TP-Moderator
 
Benutzerbild von Rizzo
 
Registriert seit: Aug 2004
Ort: Kaiserslautern
Rizzo lebt für das TP und seine UserRizzo lebt für das TP und seine UserRizzo lebt für das TP und seine UserRizzo lebt für das TP und seine UserRizzo lebt für das TP und seine UserRizzo lebt für das TP und seine UserRizzo lebt für das TP und seine UserRizzo lebt für das TP und seine UserRizzo lebt für das TP und seine User
Hallo Michael,

zeig doch mal deinen Quelltext oder einen Link zur Seite her, damit man sieht was Du versucht hast, bzw. was Probleme verursacht. Ohne Quelltext ist das nur ein Rätselraten und eine sinnvolle Hilfe ist so nicht möglich.
Rizzo ist offline   Mit Zitat antworten
Alt 11.08.2008, 23:59   #7
TP-Junior
 
Registriert seit: Aug 2008
Ort: Düsseldorf
dozent macht alles soweit korrekt
Gerne! Link gibt es leider nicht, weil die Site noch offline ist. Aber hier der Quelltext, den ich gemäß Deinen "Anweisungen" eingefügt habe:

<img src="Bilder/cinzia.jpg" alt="Cinzia Tosetti" width="100" height="149"align="left" vspace="5" hspace="3" style="border-color:#FFFFFF">

Das Bild ist links oben eingefügt. Und darüber läuft die erste Zeile des Textes. Der Rest versammelt sich brav rechts vom Bild, wie ich es mir vorstelle.
dozent ist offline   Mit Zitat antworten
Alt 12.08.2008, 08:55   #8
TP-Veteran
 
Registriert seit: May 2006
marc22 bringt sich richtig einmarc22 bringt sich richtig ein
Nee - Den ganzen Quellcode der Seite.
__________________
...Meine Meinung

1984
marc22 ist offline   Mit Zitat antworten
Alt 12.08.2008, 09:43   #9
TP-Junior
 
Registriert seit: Aug 2008
Ort: Düsseldorf
dozent macht alles soweit korrekt
Guten Morgen,

hier dann also, wie gewünscht, der Quelltext der ganzen Seite:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html><!-- InstanceBegin template="/Templates/basis.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<!-- InstanceBeginEditable name="doctitle" -->
<title>Unbenanntes Dokument</title>
<!-- InstanceEndEditable -->
<!-- InstanceBeginEditable name="head" -->

<style type="text/css">
<!--
.Stil5 {font-size: 10px}
-->
</style>
<!-- InstanceEndEditable -->
<style type="text/css">
<!--
.Stil1 { font-size: 12px;
font-family: Arial, Helvetica, sans-serif;
}
.Stil2 {color: #FF0000}
body {
background-image: url();
background-color: #003399;
}
a:link {
color: #D21F1B;
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:hover {
text-decoration: none;
}
a:active {
text-decoration: none;
}
.Stil4 {color: #003399}
-->
</style>
</head>

<body>
<div align="center"></div>
<table width="800" height="600" align="center" background="bilder/bg.gif">
<tr>
<td><table
border="0" cellpadding="5" cellspacing="10">
<tr>
<td colspan="3"><!-- InstanceBeginEditable name="Logo" --><img src="Bilder/logo_it_con_ct_nuovo.gif" width="760" height="76"><!-- InstanceEndEditable --></td>
</tr>
<tr>
<td width="150" valign="top"><p class="Stil4">Chi siamo</p>
<p class="Stil4">Come lavoriamo</p>
<p class="Stil4">Per cui/clienti</p>
<p class="Stil4">Strumenti</p>
<p class="Stil4">Nuovi mercati</p>
<p class="Stil4">Mercato del vino</p>
<p class="Stil4">Mercato del turismo</p>
<p class="Stil4">Appuntamenti</p>
<p class="Stil4">Contatti</p>
<p class="Stil4">Colofone </p></td>
<td width="450" height="380" align="left" valign="top"><!-- InstanceBeginEditable name="Fließtext" -->
<p class="Stil1">Due emittenti professionali e il loro team </p>
<p align="justify" class="Stil1"> Siamo dei professionisti della comunicazione con esperienze professionali acquisite nell'ambito dell'informazione aziendale privata, e nella progettazione e gestione di eventi culturali pubblici e privati.</p>
<p align="justify" class="Stil1 Stil2">Nuovo:</p>
<p align="justify" class="Stil1">Dal pi&ugrave; di dieci anni consigliamo i clienti in pubbliche relazioni internazionali. Rappresentiamo gli interessi dei nostri clienti nei mercati internazionali e facciamo s&igrave; che i destinatari sono informati sulle attivit&agrave; delle aziende, istituzioni oppure enti per cui lavoriamo.</p>
<p align="justify" class="Stil1">Disporriamo di un rete degli esperti per tutte le misure che sono necessarie per realizzare degli obiettivi comunicativi dei nostri clienti. In questo modo rendiamo possibile una struttura dei costi molto favorevole.</p>
<p align="justify" class="Stil1">Il nostro impegno, la nostra professionalit&agrave; e le strutture molto efficiente aiutano i nostri clienti di essere presente nel relevant set dei loro destinatari.</p>
<p align="justify" class="Stil1">Trate insegnamento da una persona a cui rivolgersi in Italia e una persona che le rappresenta in Germania - sempre e di cuore. </p>
<!-- InstanceEndEditable --></td>
<td width="200" height="380" valign="top"><!-- InstanceBeginEditable name="Aktuelles" -->
<p align="left" class="Stil1"><span class="Stil1"><img src="Bilder/cinzia.jpg" alt="Cinzia Tosetti" width="100" height="149"align="left" vspace="5" hspace="3" style="border-color:#FFFFFF">C<span class="Stil5">inzia Tosetti, giornalista per i temi di vino e di turismo, consulente per pubbliche relazioni. Oltre informazioni sulla giornalista si trova qui.</span> </span></p>
<p align="right" class="Stil1">&nbsp;</p>
<p align="left" class="Stil1"><img src="Bilder/michael.jpg" width="100" height="150" border="2" style="border-color:#FFFFFF"></p>
<!-- InstanceEndEditable --></td>
</tr>
<tr>
<td height="42" colspan="3" valign="top"><!-- InstanceBeginEditable name="Botschaft" --><img src="Bilder/acqua_01.jpg" width="760" height="42"><!-- InstanceEndEditable --></td>
</tr>
</table></td>
</tr>
</table>
</body>
<!-- InstanceEnd --></html>


... bin gespannt, ob das weiter hilft :-)

Einen schönen Tag wünscht


Michael
dozent ist offline   Mit Zitat antworten
Alt 12.08.2008, 10:06   #10
TP-Member
 
Registriert seit: Dec 2007
Lena83 macht alles soweit korrekt
Versuche es mal so

in der css-Datei folgendes einfügen:
HTML-Code:
.foto_r { float: right; margin-left: 14px; margin-bottom: 14px; border: 1px solid #000000; }
.foto_l { float: left; margin-right: 14px; margin-bottom: 14px; border: 1px solid #000000; }
und in der HTML-Datei folgendes:
HTML-Code:
<img src="2.jpg" width="160" height="160" alt="" class="foto_r" />
und weiter unten im Text die folgende Zeile (damit du den Unterschied merkst)
HTML-Code:
<img src="2.jpg" width="160" height="160" alt="" class="foto_l" />

Geändert von Lena83 (12.08.2008 um 10:26 Uhr).
Lena83 ist offline   Mit Zitat antworten
Alt 12.08.2008, 10:41   #11
TP-Junior
 
Registriert seit: Aug 2008
Ort: Düsseldorf
dozent macht alles soweit korrekt
Wenn ich css höre, zucke ich immer zusammen, weil ich mich bis damit bis heute nicht auskenne. Aber egal. Ich versuche es. Trotzdem noch eine kurze Rückfrage: Muss ich die Änderung bei den CSS-Stilen im Template vornehmen?

Danke für die Hilfe!
dozent ist offline   Mit Zitat antworten
Alt 12.08.2008, 10:58   #12
TP-Junior
 
Registriert seit: Aug 2008
Ort: Düsseldorf
dozent macht alles soweit korrekt
Ja! Ich hab's (und jetzt auch verstanden, was Andreas mir gestern sagen wollte). Vielen, vielen lieben Dank sagt

Michael
dozent ist offline   Mit Zitat antworten
Antwort

  Aktuelles Thema
  TP Hilfe Forum > Traum-Talk > Webdesign & Co.
Text umfließt Bild Text umfließt Bild
« Wie könnte man z.B. einen Link unten anzeigen lassen? | 360° Produktfotos »

Aktive Benutzer in diesem Thema: 1 (Registrierte Benutzer: 0, Gäste: 1)
 
Themen-Optionen Thema durchsuchen
Thema durchsuchen:

Erweiterte Suche
Thema bewerten
Thema bewerten:

Forumregeln
Es ist dir nicht erlaubt, neue Themen zu verfassen.
Es ist dir nicht erlaubt, auf Beiträge zu antworten.
Es ist dir nicht erlaubt, Anhänge hochzuladen.
Es ist dir nicht erlaubt, deine Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are an
Gehe zu

Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Seiteninhalt "Text mit Bild" - Bild wird nicht angezeigt cvb Typo3 3 26.03.2008 21:49
Text in Bild ... Izzmoo Photoshop 8 16.04.2005 19:54
Bild -> Text T:-)M Fireworks 5 06.04.2004 03:45
Bild und Text oelihaue Fireworks 4 02.06.2003 15:01
text im bild reetosh HTML Puristen 4 21.11.2001 12:16


Alle Zeitangaben in WEZ +1. Es ist jetzt 12:10 Uhr.

Powered by: vBulletin Version 3.7 (Deutsch)
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd. / Search Engine Friendly URLs by vBSEO 3.2.0 ©2008, Crawlability, Inc.
Traum-Projekt.com | Suchen | Archiv | Impressum | Kontakt | | | Nach oben |



1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67