Einfügen von Tabellen

Sehr wichtig bei der Gestaltung einer Seite. Früher hatten wir ein beliebiges Element an einer bestimmten Stelle im Dokument setzen. Sie lassen sich Kanten legen oder verstecken können, wenn wir nicht gerne gesehen werden. Später mit Stilen, wir machen sogar die Ränder sehen aus wie ein dekoratives Element, sondern eine Tabelle. Wir können setzen feste Farbe oder Hintergrund. Aber letztlich mit ihnen wollen wir das Design zu tun, weil, wie wir sehen werden, wird uns erlauben, zu einem bestimmten Zeitpunkt ein beliebiges Element zu platzieren.

Öffnen Sie ein neues Dokument und speichern es mit dem Namen Tabellen. Remember the Dream fügt die Erweiterung haben wir uns entschieden (htm oder html) Wir aussehen muss:

tablas.htm

Eine andere Sache ... zu halten gewöhnen, wenn insertéis etwas gehen. Nur für den Fall ok?

Im Eigenschafteninspektor gelten eine Hintergrundfarbe zu der Seite. Und wir werden eine Tabelle einfügen / Tabelle einfügen:

Bild 1

Es öffnet sich ein Dialogfeld wie folgt aus:

img2

, (Horizontales) el ancho en % , (También en píxeles) El borde y grosor , el relleno de celdas , que sera el espacio que va a quedar entre lo que insertemos en la tabla y su borde, el espacio entre las celdas y los encabezados, que ya tendrán un predeterminado estilo que aplicarán al contenido. In ihm können wir definieren die Anzahl der Zeilen (vertikale) Spalten (horizontal) Breite in% (auch in Pixeln) und Randdicke, Textabstand, also der Raum wird zwischen dem, was wir sein einzufügen sein wird in der Tabelle und ihrem Rand aufgebracht den Raum zwischen den Zellen und Überschriften, die einen ursprünglichen Stil haben zum Inhalt.

, 80% de ancho, grosor de borde 0 , si no ponemos nada en relleno y espacio, por defecto el Dreamweaver, pondrá dos píxeles. Wir legen 4 Reihen, 6 Spalten, 80% Breite, die Rahmenstärke, 0, wenn wir nicht ganz gefüllt ist alles in und Raum, die standardmäßig von Dreamweaver wird zwei Pixel setzen. Um keine Gegenstände, sollten wir setzen 0. Keine Nachrichten.

Sieht so aus:

img 3
Im Eigenschaften-Inspektor kann es komplett zu ändern. Aber jetzt wollen wir mal sehen, was wir in dieser Tabelle sagen, wir haben gerade eingefügt. Setzen Sie den Cursor in einer Zelle.

Und sehen eine Reihe von Linien und Zahlen Definition der Tabelle. In der Mitte, wir sehen einen Pfeil mit der linken Maustaste, klicken Sie darauf und wir werden in ein Untermenü, wo Sie es sehen können.

img 4

Nun, wir sind sicher, dass die gewählte Tabelle finden Sie im Eigenschaften-Inspektor:

img 5

: Oder wo sind wir im Raum des Tisches befindet sich die HTML-Tags, sehen wir gerade über Eigenschaften:

6 img

HTML-Tags zu bedenken.
<body> (von Körper, Leib) bezieht sich auf das gesamte Dokument, sehen wir in den Browser.
<table> (de, Tisch), um die gesamte Tabelle.
<tr> (aus Tabellenzeile Zeile der Tabelle) zu der Zeile, wo der Cursor
<td> (aus Tabelle oder Daten-Tabelle) in die Zelle.

Darüber hinaus stellen wir fest, dass das Etikett <td> überprüft wird, sagt dies uns ist da, wo sich der Cursor und dass, wenn Sie ein Element einzufügen, dort bleiben, wo platziert.

Wir werden Mitte der Tabelle in dem Dokument, auf dem Etikett <table> klicken:

7 img

y elegimos Centro im Eigenschaften-Inspektor Ausrichten und wir entschieden uns für Zentrum

8 img

Die Tabelle wird in der Mitte des Dokuments platziert:

img 9

Wir geben Werte, die von der Klinke (Tabelle angegeben ;)

10

píxeles de borde con el color #000066 para éste borde. 5 pixeles de separación entre los bordes de las celdas y el texto, o imagen que insertemos luego en ellas. Wir Weiß (# ​​FFFFFF) an den unteren Rand der Tabelle. 3 Kantenpixel mit der Farbe # 000066 für diesen Rand. 5 Pixel der Trennung zwischen den Zellgrenzen und Text oder Bildern, dass wir sie dann einfügen. Und 2 Pixel, Trennung zwischen den Zellen.

11

y columnas : Diese Werte haben wir die Tabelle nun auf die Zeilen und Spalten zu bemühen:

Der erste wird einen Text einfügen:

12

Keine Sorge, wenn wir sehen, dass diese Spalte breiter ist jetzt, wenn wir Text einfügen in der anderen. wird wie vorher aussehen

* Hinweis: Eigentlich wird es in Bezug auf das, was wir in die Zellen, wie die Spalte von Montag gesehen, stecken zu erweitern ist schmaler als der Mittwoch ;) Ebenso könnte ... setzen Sie einen festen Wert in jeder Spalte, wie in einem Screenshot angezeigt.

Später, mehr über die Breite der Tabellen und Spalten ;)

13

, sin tener que tocar la tabla o celdas con el cursor. Um zwischen den Spalten zu verschieben, benutzen wir die Pfeiltasten auf der Tastatur, ohne dass Sie die Tabelle oder Zellen mit dem Cursor berühren. Schneller und sicher, dass wir nicht ändern, überhaupt etwas von den Werten, die die Tabelle haben. Wählen Sie nun die erste Spalte:

14

Immobilien-Inspektor:
15

Schriftgröße: 14 Punkte, Weiß.
Ausrichtung: Centre.
Spalte mit fester Breite: 50 Pixel
Spalte Hintergrundfarbe: # CC3300

(Beachten Sie, dass die Spitze der Säule, die Anzahl der Pixel, jetzt haben wir 50 zugeordnet zeigte)

16

Das Ergebnis:

17

: Wählen Sie nun die erste Reihe, setzen Sie den Cursor in der ersten Zelle:

18

klicken Sie auf den HTML-Tag, <tr>

19

Ganze Zeile wird oberhalb ausgewählt:

20

Immobilien-Inspektor:

21

und wir haben somit:

22

Das nächste Institut wird mit den Tabellen fortsetzen und möglicherweise, wenn auch nicht allzu lange her, wir werden ein paar Links zu sehen.

Da wir nicht neue Bilder oder andere Objekte als htm Sprache eingefügt haben, werden wir nur wieder steigen index.htm Seite, Überschreiben der, den wir oben.

Veréisque haben wir nun ein Dokument mit einem anderen Namen, der nicht der Weg index.htm Dieses neue Dokument .. ernst die nächste, oder wir könnten sehen keinen Weg ..... außer mit einem Link, aber wir sind noch nicht da ;) so setzen wir alle den vollständigen Pfad : P

http://web-design.shalanastylo.com/tablas.htm

Beantworten