[html]tekst na obrazku

[bmaci3k]

Witam.

Po pocięciu w PS szablonu w kodzie obrazki powklejane są takimi komendami.

standardowy html.

Kod:

<TD>
            <IMG SRC="Obrazki/1_03.png" WIDTH=227 HEIGHT=73 ALT="">

</TD>

a moje pytanie brzmi, jak teraz zmienić kod żeby na tym obrazku pojawił się tekst.

[Kamil]

<TD style="width: 227px; height: 73px; background: url(Obrazki/1_03.png) no-repeat; >

</TD>

Moja rada zacznij kodować od nowa ręcznie, nie sugeruj się PS'em będzie Ci łatwiej w późniejszej modyfikacji.

[Mateusz K.]

Nie możesz ciąć szablonu w ten sposób... Przez photoshop wycinasz tylko obrazki (plasterki), bez kodu HTML.

Kod XHTML i CSS trzeba dopisać ręcznie, mając już pocięty layout. Obrazków używaj jako tło (w css), a tekst wpisujesz w XHTMLu, w odpowiednich DIVach...
Krok po kroku Ci tego tutaj nie opiszę, ale poszukaj kursów i tutoriali w Internecie...

[razorskate]

Jest kilka rozwiązań tego problemu.

Pierwsza opcja:

1. Tworzysz nowy div, w którym będzie się znajdował obrazek, użyjmy klasy, jeśli będzie potrzeba użyć kilka razy "tekstu na obrazku" .

2. Dodajesz w CSS kilka komend formatujących tego diva, a więc:

Kod HTML:

Kod:

<div class="tekst_na_obrazku">
<p>Zamiast tego wpisujesz tekst, który ma się pojawić na obrazku. </p>
</div>

Kod CSS:

Kod:

.tekst_na_obrazku  {
background-image:url(tu podajesz ścieżkę do pliku);  /* definicja tła */
}

Możesz jeszcze przesuwać akapit, edytować kolor, a więc dodajesz jeszcze do styli np. :

Kod:

.tekst_na_obrazku p {
text-align:left; /* left / right / center do wyboru ;) */
color:red; /* kolor tekstu */
}

Druga opcja:

kod HTML:

Kod:

<div style="border:1px solid black; position:relative; width:300px; height: 300px;">
<img src="ścieżka pliku do obrazka" alt="" />
<div style="position:absolute; bottom:0; right:0;">Tekst na obrazie</div>
</div>

Oczywiście w przykładzie powyżej trzeba zedytować ścieżkę do pliku, oraz szerokość i wysokość, ewentualnie przesunąć diva z tekstem.

Taki mały offtop:
1. Pisz małymi literami, pora już zapomnieć o znacznikach pisanych wielkimi literami.
2. Strona oparta na tabelach jest stara, niewygodna i ogólnie przez większość uważana za blee
3. Pomogłem? daj reputa ;d

[Kamil]

2. Strona oparta na tabelach jest stara, niewygodna i ogólnie przez większość uważana za blee

Niewygodna? ...

Mało masz do czynienia z klientami Tabelka jest bardzo często wykorzystywana w sklepach gdy klient np.: dodaje nietypowe zdjęcia przez WYSIWYG'a z panelu administracyjnego wtedy istnieje mniejsze prawdopodobieństwo że strona wysypie się w dużej mierze. Nie neguje wyższość div'ów nad tabelkami ponieważ jest 99,8% ona prawdą ale nie mogę się zgodzić że strona (przynajmniej część) oparta na tabelkach jest niewygodna.

P.S: Nie zmienia to faktu że powinieneś (autor tematu) liznąć trochę (x)html i css'a.

[razorskate]

Z tym niewygodna chodziło mi o stara, niemodna i w kieszeni niewygodna . Wiem o co Ci chodzi, ale jeśli trzeba sporo poprawić później na takiej stronie w kodzie to życzę powodzenia ;] . Chyba, że bardzo sprawnie całość zmontowałeś, i połączyłeś stylami, ale sądzę, że to co jest wyżej nie należy do tego typu projektów ( przynajmniej na razie ;] ) . . . Czyli ucz się XHTML, CSS PHP i bądź fajny .
Pozdrawiam.