MUNDO DEL CONOCIMIENTO

miércoles, 9 de octubre de 2013

PAGINA WEB

<html>
<head>
<title>FLORISTERÍA</title>
<link type="text/css" rel="stylesheet" href="estilos.css" />
</head>
<body>
<div id="principal">
<div id="cabecera">

</div>
<div id="menu">
<a href="pagina3.html" target="marco">ROSAS</a>
<a href="pagina1.html" target="marco">ARREGLOS</a>
<a href="pagina4.html" target="marco">DECORACIONES</a>
</div>
<div id="contenido">
<object name="marco" width="700" height="400" data="video.html"></object>
</div>
<div id="pie">

</div>
</div>
</body>
</html>

ESTILOS.CSS

body {
background-image: url(imagenes/fondo7.jpg);
}

#principal {
background: #FFBF00;
height: 800px;
width: 900px;
margin: auto;
position: relative;
margin-top: 200px;
margin-bottom: 50px;
box-shadow: 10px 10px 100px #000;
}

#cabecera {
background-image: url(imagenes/portada1.jpg);
height: 300px;
width: 900px;
position: absolute;
}

#menu {
background-image: url(imagenes/fondoo.jpg);
height: 400px;
width: 200px;
margin-top: 300px;
position: absolute;
}

#menu a {
background: #2F0B3A;
height: 40px;
width: 170px;
line-height: 40px;
color: white;
text-decoration: none;
display: inline-block;
text-align: center;
margin-left: 16px;
font-family: tahoma;
margin-top: 70px;
font-size: 1.4em;
}

#menu a:hover {
border-radius: 10px;
background-image: url(imagenes/boton1.jpg);
color: black;
-moz-border-radius-topleft:0px;
-moz-border-radius-topright:10px;
-moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomright:0px;

-webkit-border-top-left-radius:0px;
-webkit-border-top-right-radius:10px;
-webkit-border-bottom-left-radius:10px;
-webkit-border-bottom-right-radius:0px;

}

#contenido {
background: #610B21;
height: 400px;
width: 700px;
margin-top: 300px;
margin-left: 200px;
position: absolute;
}

#pie {
background-image: url(imagenes/pie5.jpg);
height: 100px;
width: 900px;
position: absolute;
margin-top: 700px;
color: white;
text-decoration: none;
font-size: 1em;
text-align: left;
display: inline-block;
line-height: 40px;
}

PARA PONER IMAGEN

<h1></h1>
<img src=imagenes/rosa19.jpg width=200 height=227 border=2 />
<br>

PARA PONER VIDEO

<object name="marco" width="690" height="380" data="video/video1.swf"></object>

CADA UNA EN VENTADAS DIFERENTES Y TODAS DENTRO DE UNA CARPETA.

domingo, 3 de marzo de 2013

repaso

nombre.

crear capa de fondo herramienta de degradado
herramienta texto
clic en capa de texto y control J
clic en copia de texto y colocar al ras el texto
con la copia de texto seleccionada clic en edición, transformar y voltear vertical.
encima de la copia del texto darle clic derecho y rasterizar capa.
clic mascara rapida darle herramienta degradado y seleccionar de un extremo a otro.
quitar mascara rapida y darle control D
clic en filtro clic distorcionar y escoger rizo.

rollo.
para los cuadritos pincel
para la copia control j a la imagen y al nivel qe queramos la copia darle en filtro, desenfocar luego desenfoque gausiano.

lunes, 8 de octubre de 2012

repasoo de capas con etiqetas y tablas

<html>
<head>
<title> pagina web </title>

</head>
<body bgcolor= pink>
<h1 align= center><i> ETIQUETAS </i></h1>

<style>
#capa {
color: #21A1CB;
background: #febbbb; /* Old browsers */
background: -moz-linear-gradient(top, #febbbb 0%, #fe9090 45%, #ff5c5c 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#febbbb), color-stop(45%,#fe9090), color-stop(100%,#ff5c5c)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #febbbb 0%,#fe9090 45%,#ff5c5c 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #febbbb 0%,#fe9090 45%,#ff5c5c 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #febbbb 0%,#fe9090 45%,#ff5c5c 100%); /* IE10+ */
background: linear-gradient(to bottom, #febbbb 0%,#fe9090 45%,#ff5c5c 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#febbbb', endColorstr='#ff5c5c',GradientType=0 ); /* IE6-9 */
border-radius: 25px 25px 25px 25px;
box-shadow: 10px 10px 10px #000;
font-family: Mistral;
font-size: 32px;
height: 200px;
margin: auto;
text-align: center;
width: 500px;

}
</style>
<div style="background: #9A0033; color: FFF; font-size: 2em;">
<p><b>Ejemplo de capa: esto es una guía para así saber como hacer capas en html usando varios códigos.</b></p>
</div>
<br>
<div id="capa">
<b> TABLAS </b>
<table bgcolor=yellow border=3 width=350 align=center>
<tr>
<td align= center colspan=2 >
<h2>DATOS DEL ALUMNO </h2>
</td>
</tr>

<tr >
<th>
nombre
</th>
<th>
grado
</th>

</tr>

<tr>
<th>
maria fernanda
</th>
<th>
4to merka
</th>

</tr>
<tr>

</div>
<br>

</body>
</html>

domingo, 7 de octubre de 2012

ETIQUETAS HTML

¿ ¿
ñ ñ
&letraacute; á
" ""
<p> parrafo
<b> negrita
<i> cursiva
<h1> mas grande
<h6> mas pequeño
<p style="color: # para poner color al párrafo

TABLAS

html>
<head>
<title> Tablas </title>
</head>
<body align=center background="img/fondo.jpg">
<h1> Ejemplos de tablas </h1>
<table border=3 align=center width=500>
<tr>
<td colspan=2 align=center bgcolor=#F69>
<h2 align=center> Datos del alumno </h2>
</td>
</tr>
<tr>
<th align=center width=50% bgcolor=#47F09E>NOMBRE</th>
<th align=center width=50% bgcolor=#A479D5>GRADO</th>
</tr>
<tr>
<td bgcolor=#79B2D5>
Johanaa
</td>
<td bgcolor=#D57993>
Mercaa
</td>
</tr>
<tr>
<td colspan=2 align=center>
<img src="img/dulce.jpg" width=500 heigth=300 />
</td>
</tr>

</table>
</body>
</html>

CAPAS

<!DOCTYPE html />
<html>
<head>
    <title>Ejemplo de capas</title>
    <meta charset="iso-8859-1" />
</head>
<body>
    <style>
    #capa {
        color: red;
        background: #CCC;
        border-radius: 25px 25px 25px 25px;
        box-shadow: 10px 10px 10px #000;
        font-family: Mistral;
        font-size: 32px;
        height: 200px;
        line-height: 200px;
        margin: auto;
        text-align: center;
        width: 500px;

    }
    </style>
    <style>
    #capa2 {
        color: red;
        background: #000;
        border-radius: 25px 25px 25px 25px;
        box-shadow: 10px 10px 10px #000;
        font-family: Mistral;
        font-size: 32px;
        height: 100px;
        line-height: 100px;
        margin: auto;
        text-align: center;
        width: 500px;

    }
    </style>
<div style="background: #990000; color: FFF; font-size: 2em;">
Ejemplo de capa
</div>
<br />
<div id="capa">
    Otro ejemplo de capa
</div>
<br>
<div id="capa2">
    Otro ejemplo de capita
</div>
<br>
</body>
</html>

LO LOGRE.!

<html>
<head>
<title> pagina web </title>

</head>
<body bgcolor = red>
<h2 align= center> ETIQUETAS </h2>
<p><b><i> mañana tengo mi examne de compu y estoy dando mis ultimas repasadaas haber como me va espero q todo me salga como
lo planeee</i></b></p>
<p><b> YA TENGO SUEÑO QUIERO DORMIRME YA</b></p>

<style>
#capa {
color: red;
background: #CCC;
border-radius: 25px 25px 25px 25px;
box-shadow: 10px 10px 10px #000;
font-family: Mistral;
font-size: 32px;
height: 200px;
margin: auto;
text-align: center;
width: 500px;

}
</style>

<div style="background: #990000; color: FFF; font-size: 2em;">
Ejemplo de capa
</div>
<br />
<div id="capa">
<b> TABLAS </b>
<table bgcolor=yellow border=3 width=350 align=center>
<tr>
<td align= center colspan=2 >
<h2>DATOS DEL ALUMNO </h2>
</td>
</tr>

<tr >
<th>
nombre
</th>
<th>
grado
</th>

</tr>

<tr>
<th>
maria fernanda
</th>
<th>
4to merka
</th>

</tr>
<tr>

</div>
</br>

</body>
</html>

jueves, 23 de agosto de 2012

HTML 5

Este es un programa para crear páginas WEB.
Lenguaje de programación es a través de letras, números y signos combinados.
También se le llama lenguaje de marco porque es una base de datos.

Ejemplo:
Unos de los programas para realizar páginas WEB con el codigo HTML es DREAMWEAVER.

PASOS PARA CREAR PÁGINAS WEB EN DREAMWEAVER:

Entrar al programa
Darle clic en HTML
Luego colocar el nombre
Crear una carpeta nueva y segura para guardar nuestra página web
Clic en configuración avanzada
Luego dentro de esa carpeta creamos otra nueva para imágenes
Clic en ABRIR
Clic en SELECCIONAR
Finalmente clic en GUARDAR

Cuando iniciamos a crear nuestra página web comenzamos con el signo < que es para abrir y con el signo > que es para cerrar. Pero cuando finalizamos escribimos estos signos </>