IESTP “UNICENTER”
Adobe Dreamweaver
MANIPULACION DE TEXTO CAPACIDADES A LOGRAR Inserta texto Selecciona texto Aplica características del texto Crea estilo css, para texto Importa documentos de Microsoft Word Crea listas Ordenadas y sin ordenar
Jr.Faustino Maldonado 279 Los Olivos
Teléf.: 687-4900 /485-3230
Página N° 17
IESTP “UNICENTER”
Adobe Dreamweaver
INSERTAR TEXTOS El texto que se inserte en una página de dreamweaver puede ser: - Digitando
: Digitar en la página html
- Copia / pegar : Copiar de internet o de culaquier documento y luego pegar en pagina html , menú edición / pegar. - Pegado Especial: Aplique pegado especial cuando esta copiando texto con vínculos , formatos y tablas de una página web.
FORMAS DE SELECCIÓN DE TEXTO -
Para seleccionar una palabra dar doble clic sobre el
-
Para seleccionar una fila de texto dar clic al lado izquierdo de la fila
- Para seleccionar un párrafo dar tres clic consecutivos sobre el . CARACTERÍSTICAS DEL TEXTO Las características del texto seleccionado pueden ser definidas a través del menú Texto, y a través del inspector de propiedades. Vamos a ver las posibilidades que se nos ofrecen a través del inspector de propiedades, aunque sean menos que las que se nos ofrecen a través del menú Texto.
Formato: Permite seleccionar un formato de párrafo ya definido para HTML, que puede ser encabezado, párrafo o preformateado. Los encabezados se utilizan para establecer Jr.Faustino Maldonado 279 Los Olivos
Teléf.: 687-4900 /485-3230
Página N° 18
IESTP “UNICENTER”
Adobe Dreamweaver
títulos dentro de un documento. El formato preformateado sirve para que el texto aparezca tal cual ha sido escrito, por ejemplo, si entre dos palabras se introducen varios espacios solo se considera uno, pero al establecer el formato preformateado se respetará que hayan varios espacios en lugar de solo uno. Seleccione el texto y aplique encabezado 1, en los encabezados se emplean para los títulos o subtítulos
Fuente: Permite seleccionar un conjunto de fuentes. Aparecen conjuntos de fuentes en lugar de una sola, ya que es posible que al establecer una única fuente el usuario no la tenga en su ordenador. El seleccionar un conjunto de fuentes posibilita que en el caso de que el usuario no tenga una fuente se aplique otra del conjunto. Por ejemplo, si seleccionamos Arial, Helvetica, Sans-serif, el texto se verá con la fuente Arial, pero si esta no existe se verá en Helvetica. Tamaño: Permite cambiar el tamaño del texto. El tamaño lo podemos indicar en diversas unidades, en píxeles, centímetros, etc... Color: Permite seleccionar el color de la fuente, ignorando el color que se haya definido en las propiedades de la página. Si no se ha establecido ningún color en las propiedades de la página ni aquí, el color del texto por defecto será el negro. Estilo: Estos botones permiten establecer si el texto aparecerá en negrita o en cursiva. A través del menú Texto también se puede, entre otras cosas, subrayar el texto. Esta opción no aparece en el panel de Propiedades ya que de normal no suele utilizarse, debido a que los vínculos aparecen subrayados y el subrayar texto normal podría hacer que el usuario pensara que se trata de un vínculo. Alinear: A través de estos botones es posible establecer la alineación del texto de una de estas cuatro formas distintas: izquierda, centrada, derecha y justificada. CREAR LISTA ORDENADA Y SIN ORDENAR
Lista: Jr.Faustino Maldonado 279 Los Olivos
Teléf.: 687-4900 /485-3230
Página N° 19
IESTP “UNICENTER”
Adobe Dreamweaver
Estos botones permiten crear listas con viñetas o listas numeradas. Es posible insertar texto a modo de lista. A su vez, la lista puede ser numerada o con viñetas. Ejemplo de lista sin ordenar (viñetas): Preparar la mochila
Sacar los libros de ese día
Introducir los libros del día siguiente
Ponerme el pijama
Lavarme los dientes
Poner el despertador
Ejemplo de lista ordenada (numeración): Mascotas 1. Perro 2. Gato 3. Aves 4. Canario 5. Loro 6. Hámster
A través del menú Texto, opción Lista, es posible acceder a las propiedades de la lista Se debe de tener el cursor en algún lugar de la lista para que se active. En la ventana Propiedades de lista se puede especificar el tipo de lista (con números o con viñetas), el tipo de números o viñetas que se utilizarán (en la propiedad Estilo:), y en el caso de las listas ordenadas, el número por el que comenzará el recuento. Sangría: Estos dos botones permiten sangrar el texto y anular la sangría. La sangría es una especie de margen que se establece a ambos lados del texto. En este caso los botones se refieren a sangría a la izquierda del texto.
Jr.Faustino Maldonado 279 Los Olivos
Teléf.: 687-4900 /485-3230
Página N° 20
IESTP “UNICENTER”
Adobe Dreamweaver
IMPORTAR UN DOCUMENTO En dreamweaver puede importar en formatos xml ,datos tabla, documentos de Word y documentos de Excel. 1. Cree un documento nuevo 2. Menú archivo / importar
3. Seleccione el documento
4. Guarde con el nombre importar CREACIÓN DE ESTILO CSS PARA TEXTO En el menú Texto / Estilo css / nuevo Los estilos CSS están en hojas de estilo de actualización automática (también denominadas Hojas de Estilo en Cascada) se utilizan para combinar una serie de atributos del texto, como pueden ser el color o el tamaño, de modo que no sea necesario asignar estos atributos uno a uno cada vez que se desee repetir la asignación de esos mismos valores a otras partes del texto. También algunas de sus opciones pueden utilizarse para definir atributos de imágenes y otras características que no permitían definir los estilos HTML en versiones anteriores, como el color de fondo para el texto, etc.
Crear un Estilo Personalizado 1. Menú ventana / estilos css , en esta cuadro dar clic en el botón todo
Adjuntar hoja de estilo
Nueva regla css
2. Para crear un estilos dar clic en el botón nueva regla css
Jr.Faustino Maldonado 279 Los Olivos
Teléf.: 687-4900 /485-3230
Página N° 21
IESTP “UNICENTER”
Adobe Dreamweaver
3. En este cuadro ,seleccione el tipo de selector clase ,nombre párrafo , seleccione nuevo archivo de hoja de estilo y aceptar
Tipo de selector:
Clase: (Puede ser aplicable a cualquier elemento html) Se puede utilizar todas las veces que se requiera en un mismo documento Puede tener cualquier nombre Se reconoce porque lleva un punto delante del nombre Ejemplo (.galería)
Etiquetas: (Redefine un elemento html) Se utiliza para modificar una etiqueta ya existente del html Los nombres ya están definidos Se reconoce por qué no lleva ningún símbolo delante del nombre. Ejemplo: (body, h1, p, ul, li, img) Avanzadas (ID selector contextual,etc) -
-
Solo se puede aplicar a un elemento html una sola vez. Generalmente se usa en capas, div y texto. Puede aplicarse la regla css y etiqueta HTML, como la imagen siguiente. Puede tener cualquier nombre.
-
Se reconoce porque lleva un delante del nombre
-
.
4. Guarde con el nombre estilos 5. Seleccione fuente “arial,hevetica,sans-serif” ,tamaño “12” y color “#0066CC”
6. Aceptar 7. Seleccione un párrafo y aplique el estilo “párrafo”
Jr.Faustino Maldonado 279 Los Olivos
Teléf.: 687-4900 /485-3230
Página N° 22