Antworten auf deine Fragen:
Neues Thema erstellen

[HTML] Anzeige von der Website Verkleiner

Loopex

Loopex

The Rázik

Guten Abend,

Ich habe mit Photoshop eine Seite erstellt und jetzt ich sie angucke im Browser ist sie immer so groß als würde ich ran zoome jetzt wollte ich fragen ob ich die Skalierung so ändern kann das es sie sich denn Browser anpasst ?

Lg S.Z
 

R

Raphale

angehender Webentwickler

AW:
HTML: 
 Anzeige von der Website Verkleiner[/b]

Mit Photoshop ?? Ist das jetzt ein Bild oder was ? Wenn es HTML ist, ja einfach Prozentuale Angaben in der Breite angeben (CSS).
 
Loopex

Loopex

The Rázik

AW:
HTML: 
 Anzeige von der Website Verkleiner[/b]

nein es ist jetzt Html habe mit Webspeicher gemacht 
mit CSS kenne ich mich nicht aus kann ich es in die Html mit rein schreiben
oder eine externe css datei erstellen dafür wenn ja wie ist der code und wie muss ich die datei nennen ?

danke schon mal für die antwort
 
R

Raphale

angehender Webentwickler

AW:
HTML: 
 Anzeige von der Website Verkleiner[/b]

Am besten geht das wenn du den Quellcode und CSS  zeigst bzw. die Seite (insofern Online).
Ansonsten geh in die CSS rein und Suche nach Angaben wie "width:1280px;" da spielst du dann mit Prozenten rum (100% ist die Breite des darüberliegenden Elementes) das letzte Element ist dann das Ausgabegerät...
hehe das wird aber ohne Hintergrundwissen HEAVY :)

Poste besser deinen Code oder lern HTML und CSS ;)
 
Loopex

Loopex

The Rázik

AW:
HTML: 
 Anzeige von der Website Verkleiner[/b]

Hier ist mal der Quellcode

[HTML]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Startseite</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body bgcolor="#FFFFFF">
<!-- Save for Web Slices (Startseite.psd) -->
<center>
<table id="Tabelle_01" width="1601" border="0" cellpadding="0" cellspacing="0">
    <tr>
        <td colspan="24">
            <img id="index_01" src="http://www.psd-tutorials.de/forum/images/index_01.jpg" width="1600" height="474" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="1" height="474" alt="" /></td>
    </tr>
    <tr>
        <td colspan="17">
            <img id="index_02" src="http://www.psd-tutorials.de/forum/images/index_02.jpg" width="1044" height="14" alt="" /></td>
        <td colspan="3" rowspan="4">
            <img id="index_03" src="http://www.psd-tutorials.de/forum/images/index_03.jpg" width="186" height="66" alt="" /></td>
        <td colspan="4" rowspan="6">
            <img id="index_04" src="http://www.psd-tutorials.de/forum/images/index_04.jpg" width="370" height="338" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="1" height="14" alt="" /></td>
    </tr>
    <tr>
        <td colspan="5" rowspan="4">
            <img id="index_05" src="http://www.psd-tutorials.de/forum/images/index_05.jpg" width="397" height="292" alt="" /></td>
        <td colspan="2" rowspan="2">
            <img id="index_06" src="http://www.psd-tutorials.de/forum/images/index_06.jpg" width="146" height="29" alt="" /></td>
        <td colspan="2" rowspan="10">
            <img id="index_07" src="http://www.psd-tutorials.de/forum/images/index_07.jpg" width="40" height="1150" alt="" /></td>
        <td rowspan="3">
         <img id="index_08" src="http://www.psd-tutorials.de/forum/images/index_08.jpg" width="107" height="52" alt="" /></td>
        <td colspan="2" rowspan="10">
            <img id="index_09" src="http://www.psd-tutorials.de/forum/images/index_09.jpg" width="40" height="1150" alt="" /></td>
        <td rowspan="2">
            <img id="index_10" src="http://www.psd-tutorials.de/forum/images/index_10.jpg" width="100" height="29" alt="" /></td>
        <td colspan="4">
            <img id="index_11" src="http://www.psd-tutorials.de/forum/images/index_11.jpg" width="214" height="5" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="1" height="5" alt="" /></td>
    </tr>
    <tr>
        <td colspan="2" rowspan="9">
            <img id="index_12" src="http://www.psd-tutorials.de/forum/images/index_12.jpg" width="33" height="1145" alt="" /></td>
        <td rowspan="2">
            <img id="index_13" src="http://www.psd-tutorials.de/forum/images/index_13.jpg" width="177" height="47" alt="" /></td>
        <td rowspan="12">
            <img id="index_14" src="http://www.psd-tutorials.de/forum/images/index_14.jpg" width="4" height="1307" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="1" height="24" alt="" /></td>
    </tr>
    <tr>
        <td colspan="2" rowspan="2">
            <img id="index_15" src="http://www.psd-tutorials.de/forum/images/index_15.jpg" width="146" height="263" alt="" /></td>
        <td rowspan="8">
            <img id="index_16" src="http://www.psd-tutorials.de/forum/images/index_16.jpg" width="100" height="1121" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="1" height="23" alt="" /></td>
    </tr>
    <tr>
        <td rowspan="7">
            <img id="index_17" src="http://www.psd-tutorials.de/forum/images/index_17.jpg" width="107" height="1098" alt="" /></td>
        <td rowspan="7">
            <img id="index_18" src="http://www.psd-tutorials.de/forum/images/index_18.jpg" width="177" height="1098" alt="" /></td>
        <td colspan="3" rowspan="2">
            <img id="index_19" src="http://www.psd-tutorials.de/forum/images/index_19.jpg" width="186" height="272" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="1" height="240" alt="" /></td>
    </tr>
    <tr>
        <td colspan="3" rowspan="5">
            <img id="index_20" src="http://www.psd-tutorials.de/forum/images/index_20.jpg" width="333" height="763" alt="" /></td>
        <td colspan="3" rowspan="3">
            <img id="index_21" src="http://www.psd-tutorials.de/forum/images/index_21.jpg" width="93" height="153" alt="" /></td>
        <td rowspan="6">
            <img id="index_22" src="http://www.psd-tutorials.de/forum/images/index_22.jpg" width="117" height="858" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="1" height="32" alt="" /></td>
    </tr>
    <tr>
        <td colspan="2" rowspan="5">
            <img id="index_23" src="http://www.psd-tutorials.de/forum/images/index_23.jpg" width="119" height="826" alt="" /></td>
        <td colspan="2">
            <img id="index_24" src="http://www.psd-tutorials.de/forum/images/index_24.jpg" width="102" height="102" alt="" /></td>
        <td colspan="3" rowspan="3">
            <img id="index_25" src="http://www.psd-tutorials.de/forum/images/index_25.jpg" width="335" height="688" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="1" height="102" alt="" /></td>
    </tr>
    <tr>
        <td colspan="2" rowspan="4">
            <img id="index_26" src="http://www.psd-tutorials.de/forum/images/index_26.jpg" width="102" height="724" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="1" height="19" alt="" /></td>
    </tr>
    <tr>
        <td colspan="3" rowspan="3">
            <img id="index_27" src="http://www.psd-tutorials.de/forum/images/index_27.jpg" width="93" height="705" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="1" height="567" alt="" /></td>
    </tr>
    <tr>
        <td rowspan="5">
            <img id="index_28" src="http://www.psd-tutorials.de/forum/images/index_28.jpg" width="110" height="300" alt="" /></td>
        <td rowspan="2">
            <img id="index_29" src="http://www.psd-tutorials.de/forum/images/index_29.jpg" width="177" height="138" alt="" /></td>
        <td rowspan="5">
            <img id="index_30" src="http://www.psd-tutorials.de/forum/images/index_30.jpg" width="48" height="300" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="1" height="43" alt="" /></td>
    </tr>
    <tr>
        <td rowspan="4">
            <img id="index_31" src="http://www.psd-tutorials.de/forum/images/index_31.jpg" width="21" height="257" alt="" /></td>
        <td rowspan="3">
            <img id="index_32" src="http://www.psd-tutorials.de/forum/images/index_32.jpg" width="205" height="205" alt="" /></td>
        <td rowspan="4">
            <img id="index_33" src="http://www.psd-tutorials.de/forum/images/index_33.jpg" width="107" height="257" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="1" height="95" alt="" /></td>
    </tr>
    <tr>
        <td rowspan="3">
            <img id="index_34" src="http://www.psd-tutorials.de/forum/images/index_34.jpg" width="46" height="162" alt="" /></td>
        <td colspan="3">
            <img id="index_35" src="http://www.psd-tutorials.de/forum/images/index_35.jpg" width="164" height="73" alt="" /></td>
        <td rowspan="3">
            <img id="index_36" src="http://www.psd-tutorials.de/forum/images/index_36.jpg" width="27" height="162" alt="" /></td>
        <td colspan="2">
       <img id="index_37" src="http://www.psd-tutorials.de/forum/images/index_37.jpg" width="120" height="73" alt="" /></td></a>
        <td rowspan="3">
            <img id="index_38" src="http://www.psd-tutorials.de/forum/images/index_38.jpg" width="22" height="162" alt="" /></td>
        <td colspan="3">
            <img id="index_39" src="http://www.psd-tutorials.de/forum/images/index_39.jpg" width="131" height="73" alt="" /></td>
        <td rowspan="3">
            <img id="index_40" src="http://www.psd-tutorials.de/forum/images/index_40.jpg" width="20" height="162" alt="" /></td>
        <td>
            <img id="index_41" src="http://www.psd-tutorials.de/forum/images/index_41.jpg" width="177" height="73" alt="" /></td>
        <td rowspan="3">
            <img id="index_42" src="http://www.psd-tutorials.de/forum/images/index_42.jpg" width="12" height="162" alt="" /></td>
        <td colspan="2">
            <img id="index_43" src="http://www.psd-tutorials.de/forum/images/index_43.jpg" width="174" height="73" alt="" /></td>
        <td rowspan="3">
            <img id="index_44" src="http://www.psd-tutorials.de/forum/images/index_44.jpg" width="35" height="162" alt="" /></td>
        <td rowspan="3">
            <img id="index_45" src="http://www.psd-tutorials.de/forum/images/index_45.jpg" width="177" height="162" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="1" height="73" alt="" /></td>
    </tr>
    <tr>
        <td colspan="3" rowspan="2">
            <img id="index_46" src="http://www.psd-tutorials.de/forum/images/index_46.jpg" width="164" height="89" alt="" /></td>
        <td colspan="2" rowspan="2">
            <img id="index_47" src="http://www.psd-tutorials.de/forum/images/index_47.jpg" width="120" height="89" alt="" /></td>
        <td colspan="3" rowspan="2">
            <img id="index_48" src="http://www.psd-tutorials.de/forum/images/index_48.jpg" width="131" height="89" alt="" /></td>
        <td rowspan="2">
            <img id="index_49" src="http://www.psd-tutorials.de/forum/images/index_49.jpg" width="177" height="89" alt="" /></td>
        <td colspan="2" rowspan="2">
            <img id="index_50" src="http://www.psd-tutorials.de/forum/images/index_50.jpg" width="174" height="89" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="1" height="37" alt="" /></td>
    </tr>
    <tr>
        <td>
            <img id="index_51" src="http://www.psd-tutorials.de/forum/images/index_51.jpg" width="205" height="52" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="1" height="52" alt="" /></td>
    </tr>
    <tr>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="21" height="1" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="205" height="1" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="107" height="1" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="46" height="1" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="18" height="1" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="29" height="1" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="117" height="1" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="27" height="1" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="13" height="1" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="107" height="1" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="22" height="1" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="18" height="1" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="100" height="1" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="13" height="1" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="20" height="1" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="177" height="1" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="4" height="1" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="12" height="1" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="107" height="1" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="67" height="1" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="35" height="1" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="110" height="1" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="177" height="1" alt="" /></td>
        <td>
            <img src="http://www.psd-tutorials.de/forum/images/Abstandhalter.gif" width="48" height="1" alt="" /></td>
        <td></td>
    </tr>
</table>
</center>
<!-- End Save for Web Slices -->
</body>
</html>
 
Zuletzt bearbeitet von einem Moderator:
R

Raphale

angehender Webentwickler

AW:
HTML: 
 Anzeige von der Website Verkleiner[/b]

Ach du scheiße hahaha... ehm schick ma nen Bild von deiner Seite ich bau dir das mal eben in HTML5 um ^^
 
Loopex

Loopex

The Rázik

AW:
HTML: 
 Anzeige von der Website Verkleiner[/b]

Habe dir eine E-mail geschickt habe dir die datei noch mal so geschickt über e-mail
 
patrick_l

patrick_l

Hat es drauf

AW:
HTML: 
 Anzeige von der Website Verkleiner[/b]

Das was Photoshop da ausspuckt kann man höchstes als Mockup gebrauchen. Die Umsetzung sollte immer per Hand erfolgen. Also HTML Grundgerüst samt Formatierungen mit CSS per Hand. Bei der Tabelle wird einem ganz anders. ;) 

Liebe Grüße, Patrick
 
Loopex

Loopex

The Rázik

AW:
HTML: 
 Anzeige von der Website Verkleiner[/b]

Danke Partick für deine Antwort da ich leider mich nie in die Materie eingelernt habe 
weiß ich nicht wie ich das machen muss aber da ich hier nette member habe die mir helfen ist es super ich bin halt nur ein web grafiker und erstelle auch nur die homepages also das layout aber wenn ich mal zeit habe würde ich gerne mich mal bei einen von euch melden das ihr mit mal einen crash kurz gibt wenn es von eurer seite möglich wäre
 
patrick_l

patrick_l

Hat es drauf

AW:
HTML: 
 Anzeige von der Website Verkleiner[/b]

Wenn du dich wirklich damit auseinandersetzen möchtest, hier ein paar lesenswerte Quellen für dich. Wenn du die durch und die Inhalte verinnerlicht hast, wirst du auch bei der Umsetzung deiner Layouts keine Probleme haben. 

- [URL="http://webkompetenz.wikidot.com/docs:html-handbuch"]HTML5-Handbuch - Webkompetenz[/URL] 
- [URL="https://developer.mozilla.org/de/learn"]Mozilla Developer Network | Lerne HTML, CSS & JS[/URL] 
- [URL="http://jendryschik.de/wsdev/einfuehrung/"]Einführung in XHTML, CSS & Webdesign (Michael Jendryschik)[/URL] 
- [URL="http://little-boxes.de/"]Little Boxes | Webseiten gestalten - HTML & CSS (Peter Müller)[/URL] 
- [URL="http://www.css4you.de/"]CSS 4 You - The Finest in Stylesheets[/URL] 

Liebe Grüße, Patrick
 
Loopex

Loopex

The Rázik

AW:
HTML: 
 Anzeige von der Website Verkleiner[/b]

oke ich danke dir Patrick werde mich nächste woche mal drauf ein lesen ^_^
 
heikehk

heikehk

die freundliche Eule

AW:
HTML: 
 Anzeige von der Website Verkleiner[/b]

Rechne mal mit etwas mehr als einer Wochen zum verinnerlichen.
Abr Tabellen sind gruselig und ein absolutes no go...
 
Myhar

Myhar

Hat es drauf

AW:
HTML: 
 Anzeige von der Website Verkleiner[/b]

Das ist keine Funktion sondern ein Attribut. 
Und nur weil Tabellen früher missbräuchlich verwendet wurden heißt es nicht, dass es damals richtig war.
 
N

Nighteyess

Noch nicht viel geschrieben

AW:
HTML: 
 Anzeige von der Website Verkleiner[/b]

Ich meinte Attribut, entschuldige unfehlbarer Forenuser.
Und das es richtig war habe ich nicht behauptet oder?
Habe nur gesagt das es üblich bzw. Normal war und damals schon niemand groß 
gemeckert hat das Tabellen dafür missbraucht wurden.
 
Loopex

Loopex

The Rázik

Das es länger dauert als ne Woche ist mir schon klar ich glaube kein mensch bekommt das so Schnell nicht hin aber trozdem danke ^_^

Und das mit den Tabellen ist wirklich grausam es hat sich nie viel verändert aber manche machen sich halt auch die arbeit das es super aussieht :cool
 
Zuletzt bearbeitet:
heikehk

heikehk

die freundliche Eule

AW:
HTML: 
 Anzeige von der Website Verkleiner[/b]

Hallo Loopex, wollte dir damit nicht auf die Füße treten...
Es ändert sich nur so viel und gibt so viele Dinge zu beachten, damit eine Seite möglichst in vielen Browsern und Geräten gut aussieht, dass man beim gestalten einer Homepage doch einiges an zeit allein für diese Planung und Überlegungen investieren muss. Das Ganze dann in korrektem Html und CSS umzusetzen dann der nächste Part.
Man kann, soweit ich es mitbekommen habe in html 5 auch Hintergrundbilder skalieren. Wenn das Bild alleine steht, kannst du ihm per CSS auch eine maximale und minimale Größe mit einer Prozentangabe mitgeben. Hängt vom Layout ab. 
Viel Erfolg beim einarbeiten
Heike
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden
Zu den Gratis-Inhalten

Neueste Themen & Antworten

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Gesamt: 237 (Mitglieder: 4, Gäste: 233)
Robots: 1.085

Statistik des Forums

Themen
118.564
Beiträge
1.538.064
Mitglieder
67.487
Neuestes Mitglied
MichaelSEivy
Oben