HTML Básico con Hee: 2 Creación de Tablillas - Primeros Pasos para Crear Tablillas Básicas

Ver el tema anterior Ver el tema siguiente Ir abajo

HTML Básico con Hee: 2 Creación de Tablillas - Primeros Pasos para Crear Tablillas Básicas

Mensaje por Hee-Young el Lun Mayo 16, 2016 11:01 pm


HTML Básico con Hee
Lección 2: Primeros Pasos para Crear Tablillas Básicas


Antes de iniciar la pequeña clase, agradezco a quien se tome la molestia de leer este tutorial, pero como todo en la vida, se necesitan unas indicaciones antes de iniciar la clase.

  • El Nivel de Dificultad es Básico, por lo que, si eres más experimentando en el formato HTML posiblemente esto no te sirva para nada, pero pido que no critiques a las personas que si están interesadas en este tema y lleguen a postear alguna duda que les pueda surgir, después de todo, nadie nace sabiendo y una burla, por mínima que sea, puede quitarle las ganas a quien sea de aprender.
  • El tutorial esta realizado para la plataforma de ForoActivo, dirigido a la creación de tablillas y un mejor entendimiento de estas propiedades, por ende, si lo que buscas es saber cómo crear una página HTML y demás, este no es un tutorial para ti.
  • Como dije antes y, a pesar de ser reiterativa, es un tutorial de HTML, no CSS ni tampoco JS, por ende no pidan nada referido a ello porque no está destinado a ese rubro.
  • Es un tutorial de mi autoría, por lo que, si lo ves en otro lugar, infórmamelo porque de momento, solo estoy publicando en y para M-Chains. Y por lo mismo, está prohibido copiarlo, postearlo en otro sitio y demás, sin mi permiso.
  • Al no ser esta mi única cuenta aquí, si tienes dudas, aunque fueran mínimas, postéalas y no envíes Mp, porque quizás lo lea el mismo día, como luego de 2 semanas cuando ya no te interesaría mi respuesta.
  • A pesar de que este sea un tutorial, tómenlo como una mini-clase, si desean aportar algo más a lo ya expuesto, retomar una pregunta anterior y demás, háganlo con confianza. Se trata de aprender y todo nuevo consejo, apoyo, pregunta o aporte siempre sirve.
  • Si quieres dejar una pequeña crítica, o pedir algo en especial para un nuevo tutorial, eres libre de hacerlo. Pero, las críticas deben ser constructivas, y si deseas que explique algo de HTML, no hare caso de “presiones”, ya que quiero ir paso por paso, para aquellos que apenas inicien en el tema, después de todo, ni siquiera yo soy experta en esta rama.
  • Si quieres ser un “Alumno Fijo”, puedes postear aquí algo simple como… “Quiero seguir tus clases” y me guiare de eso, para enviar un Mp a la cuenta que lo menciono, cada que saque un nuevo tutorial.
  • A quienes sean “Alumnos fijos” les dejare una pequeña tarea luego de cada clase, para ir mirando su progreso, pueden ser desde una captura, hasta el diseño hecho y posteado.




Recordando Datos Útiles
Links Importantes


Propiedades Aprendidas en la Clase 1


  • div [Para abrir y cerrar la tablilla]
  • width [Ancho]
  • height [Alto]
  • border [Borde o contorno]





Inicio de clase
Parte 1

Aunque no lo crean, desde este momento empezaremos a probar las bases para crear una tablilla, aplicando unos datos extras a lo enseñado en la clase pasada, o incluso, con la misma utilización de ellos.

Claro que, antes que nada, muchos ya sabrán lo que es una tablilla y para qué sirve, pero para aquellos que no, un claro ejemplo de tablilla es este lindo recuadro donde yo estoy escribiendo ahora, en si este modelo es básico, pero con aplicación de complementos puede hacer cosas más elaboradas, todo con tal de hacer nuestros temas más bonitos a simple vista.

En esta clase, aplicaremos a lo ya enseñado anteriormente, unos pocos complementos más para conseguir una tablilla simple, desde la cual empezaremos a partir para crear algo más grande. Las nuevas propiedades a enseñar serán:


  • padding
  • background
  • overflow
  • max-height o width



Ahora, estarán con la clara pregunta en sus mentes ¿Para qué demonios sirven estas cosas? Aunque no lo crean, es bastante sencillo de entender, en la clase anterior, les solicite hicieran un pequeño recuadro con palabras dentro, pero ¿Qué pasaba? Las palabras quedaban muy unidas al borde que aplicaron, y en algunos casos de ser la oración muy larga se salía de las propiedades que ustedes crearon, debiendo hacer “crecer” el width o height de manera frecuente para que todo encajara de manera adecuada.

Con las nuevas propiedades que les enseñare ahora, ya no tendrán este problema. Pero antes de iniciar con la creación de nuestra tablilla estándar, con la cual de ahora en más partiremos para futuras clases donde se harán algunos complementos a lo expuesto hoy, les daré una rápida explicación de las nuevas propiedades para saber a qué se enfrentaran en esta clase.


  • El Padding: Esta propiedad sirve para marcar en forma de PX, una distancia desde el borde pre-establecido, y el nuevo contenido. Con esto evitaran que sus palabras queden pegadas al borde, logrando una estética mejor.
  • El Background: A pesar de su nombre, es simplemente el color de fondo de la tablilla, este puede o no utilizarse, sin embargo de no emplearse su tablilla adquirirá el color por defecto del foro, por lo mismo a veces es bueno aplicarle, para que la combinación de colores seleccionada no se pierda.
  • El Overflow: Esta propiedad es algo que seguramente desearan recordar de ahora en más, porque sirve para crear el tan afamado Scroll.
  • El Max-width o max-height: Si colocaran un Scroll, esta es la propiedad que debe acompañarle por defecto ¿Por qué? Pues, simplemente porque esta es la propiedad que indicara cual es el ancho o largo máximo que alcanzara su tablilla antes de que el Scroll se haga presente.


Finalmente con todo esto explicado, es hora de implementarlo.


Parte 2

Si aún no abrieron el programa para empezar a probar códigos, es buen momento para hacerlo, ya que la manera más fácil de explicarles la utilización de estas herramientas es practicando.

La clase pasada les deje un ejemplo de pequeña tablilla junto con la tarea, jugaremos con ella para irles demostrando las nuevas propiedades.


Ejemplo para la clase del HTML dada por la zorrita esponjada

Código:
<div style="width: 250px; height: 120px; border: dashed 5px #ff0099;"> Ejemplo para la clase del HTML dada por la zorrita esponjada </div>

Si siguieron bien mis explicaciones de la clase anterior, el code se les hará sencillo de comprender, sino, les recomiendo volver a releerla, dando click al link que coloque antes, porque si retomo la explicación nuevamente este tutorial no tendrá fin, por lo mismo, este sería un buen momento para releer, y luego continuar con esta clase.

Ahora, siguiendo el orden de las nuevas características que mencione, empezaremos a jugar un poco con el recuadro. Iniciaremos con el Padding, en este caso le dare un “padding:15px;” para que noten como cambia.


Ejemplo para la clase del HTML dada por la zorrita esponjada

Código:
<div style="width: 250px; height: 120px; border: dashed 5px #ff0099;padding:15px;"> Ejemplo para la clase del HTML dada por la zorrita esponjada </div>


Como verán en el nuevo ejemplo, con la aplicación del Padding, las letras se alejaron del borde, pero trajo consigo un crecimiento en la tablilla, esto se debe al agregado de los nuevos pixeles en la parte interna que crean la separación, tengan esto en cuenta cuando estén creando una tablilla, si sumaran Padding, pero desean mantener el viejo tamaño, deberían quitarle al height y width la misma cantidad de PX que fueron agregadas al Padding, en este caso los 15.

En mi caso no lo hare, porque no me crea un real inconveniente al ser una tablilla relativamente pequeña.

Lo siguiente en nuestro listado de propiedades, es el Background. Si recuerdan el Border, a este se le aplicaba el color en un formato de este modo “#FFF”, con el Background es exactamente lo mismo, en mi caso me agrada el #EEE porque es un gris claro que es de fácil lectura, sin embargo lo editare con otro color, para que asi puedan notar de mejor manera el empleado de este atributo, mi Background tendrá el color #FFF que en pocas palabras es el color blanco, quedando así “background: #fff;” y el resultado es este:


Ejemplo para la clase del HTML dada por la zorrita esponjada

Código:
<div style="width: 250px; height: 120px; border: dashed 5px #ff0099;padding:15px;background: #fff;"> Ejemplo para la clase del HTML dada por la zorrita esponjada </div>

Como dato extra, si se fijan, entre cada nueva propiedad, voy colocando un “punto y coma”, para separarlas, cosa que explique en el viejo tutorial, ya que sin esto la computadora no podrá leer su código. Se los recuerdo porque parece no ser importante sin embargo realmente lo es.

Continuando con la clase, ahora que el cuadro tiene un Background, dejo de estar utilizando el color de fondo por defecto del foro, viéndose completamente blanco, incluso en la zona del Border expuesta, esto es debido a que el Background cubre todos los pixeles indicados en nuestro Width y Heigt.

Ahora, para explicar las siguientes propiedades, en lugar de hacerlas una por una, se harán juntas, ya que una depende de la otra. Iniciando con el Overflow, este siempre, y recuerden, siempre, debe colocarse de esta manera “overflow: auto;” No necesita que coloquen pixeles ni nada, bien podrían decir que es una propiedad de copia-pega.

Sin embargo, esta no podrá funcionar si no establecemos un máximo a nuestro Widht o Height, dependiente el tipo de Scroll que deseen salga. Lo más común es colocar solamente el Scroll para lo largo, es decir, para el Height, sin embargo, se los demostrare de ambos modos.

Iniciaremos con el Widht, en nuestro code ya tenemos uno establecido, y para no perjudicar la proporción que ya está dada, simplemente al Widht base, le pondré la palabra “Max” por delante, quedando de esta manera “max-width: 250px;


EjemploparalaclasedelHTMLdadaporlazorritaesponjadaEjemploparalaclasedelHTMLdadaporlazorritaesponjada Ejemplo para la clase del HTML

Código:
<div style=" max-width: 250px; height: 120px; border: dashed 5px #ff0099;padding:15px;background: #fff; overflow: auto;"> EjemploparalaclasedelHTMLdadaporlazorritaesponjadaEjemploparalaclasedelHTMLdadaporlazorritaesponjada Ejemplo para la clase del HTML</div>


Aquí notaran que junte todas las palabras, para que de ese modo el Scroll salga de manera lateral, sin embargo, y a mi parecer, la mejor manera de colocar un Scroll es en el Heigth, ya que si la palabra es muy larga las ira bajando, pero esto no quita que puedan establecer un máximo en ambas propiedades.

Ahora, les mostrare como luciría el code, si en vez de “max-width: 250px;” pusiéramos “ max-height: 120px;

Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada

Código:
<div style="width: 250px; max-height: 120px; border: dashed 5px #ff0099;padding:15px;background: #fff; overflow: auto;">Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada Ejemplo para la clase del HTML dada por la zorrita esponjada</div>


Con esto, las propiedades quedaron explicadas, y pueden jugar todo lo que deseen con las mismas para hacer una tablilla sencilla, ya que con estos datos, quedaría a su imaginación poder establecer el pequeño recuadro.

Recuerden que si tienen problemas, pueden fácilmente preguntarme en este tema y no por MP, les explicare al instante.



Tarea

Crear un cuadrito con Scroll, aplicando lo aprendido en esta clase y la anterior, con los siguientes parámetros:

Alto: 300
Ancho: 300
Borde: A elección
Padding: A elección
Contenido dentro del recuadro: Frase a elección. Incluso pueden sacar alguna de la web.

Les recomiendo probarlo primero en la página que les pase más arriba, y luego, pueden hacerle una captura, o postearlo como respuesta en este tema.

Les recuerdo que, pueden utilizar los botones del foro para darle un mejor detalle a sus letras, incluso establecer el orden de estas con el [ center ] y demas.

Un Ejemplo

¿Qué es HTML?


HTML, sigla en inglés de HyperText Markup Language (lenguaje de marcas de hipertexto), hace referencia al lenguaje de marcado para la elaboración de páginas web. Es un estándar que sirve de referencia del software que conecta con la elaboración de páginas web en sus diferentes versiones, define una estructura básica y un código (denominado código HTML) para la definición de contenido de una página web, como texto, imágenes, videos, juegos, entre otros. Es un estándar a cargo del World Wide Web Consortium (W3C) o Consorcio WWW, organización dedicada a la estandarización de casi todas las tecnologías ligadas a la web, sobre todo en lo referente a su escritura e interpretación. Se considera el lenguaje web más importante siendo su invención crucial en la aparición, desarrollo y expansión de la World Wide Web (WWW). Es el estándar que se ha impuesto en la visualización de páginas web y es el que todos los navegadores actuales han adoptado.1

El lenguaje HTML basa su filosofía de desarrollo en la diferenciación. Para añadir un elemento externo a la página (imagen, vídeo, script, entre otros.), este no se incrusta directamente en el código de la página, sino que se hace una referencia a la ubicación de dicho elemento mediante texto. De este modo, la página web contiene solamente texto mientras que recae en el navegador web (interpretador del código) la tarea de unir todos los elementos y visualizar la página final. Al ser un estándar, HTML busca ser un lenguaje que permita que cualquier página web escrita en una determinada versión, pueda ser interpretada de la misma forma (estándar) por cualquier navegador web actualizado.

Sin embargo, a lo largo de sus diferentes versiones, se han incorporado y suprimido diversas características, con el fin de hacerlo más eficiente y facilitar el desarrollo de páginas web compatibles con distintos navegadores y plataformas (PC de escritorio, portátiles, teléfonos inteligentes, tabletas, vipers etc. No obstante, para interpretar correctamente una nueva versión de HTML, los desarrolladores de navegadores web deben incorporar estos cambios y el usuario debe ser capaz de usar la nueva versión del navegador con los cambios incorporados. Normalmente los cambios son aplicados mediante parches de actualización automática (Firefox, Chrome) u ofreciendo una nueva versión del navegador con todos los cambios incorporados, en un sitio web de descarga oficial (Internet Explorer). Por lo que un navegador desactualizado no será capaz de interpretar correctamente una página web escrita en una versión de HTML superior a la que pueda interpretar, lo que obliga muchas veces a los desarrolladores a aplicar técnicas y cambios que permitan corregir problemas de visualización e incluso de interpretación de código HTML. Así mismo, las páginas escritas en una versión anterior de HTML deberían ser actualizadas o reescritas, lo que no siempre se cumple. Es por ello que ciertos navegadores todavía mantienen la capacidad de interpretar páginas web de versiones HTML anteriores. Por estas razones, todavía existen diferencias entre distintos navegadores y versiones al interpretar una misma página web.


Código:
<div style="width: 300px; max-height: 300px; border: outset 10px #ff0099;padding:10px;background: #fff; overflow: auto;">[b][center]¿Qué es HTML?[/center][/b]

HTML, sigla en inglés de HyperText Markup Language (lenguaje de marcas de hipertexto), hace referencia al lenguaje de marcado para la elaboración de páginas web. Es un estándar que sirve de referencia del software que conecta con la elaboración de páginas web en sus diferentes versiones, define una estructura básica y un código (denominado código HTML) para la definición de contenido de una página web, como texto, imágenes, videos, juegos, entre otros. Es un estándar a cargo del World Wide Web Consortium (W3C) o Consorcio WWW, organización dedicada a la estandarización de casi todas las tecnologías ligadas a la web, sobre todo en lo referente a su escritura e interpretación. Se considera el lenguaje web más importante siendo su invención crucial en la aparición, desarrollo y expansión de la World Wide Web (WWW). Es el estándar que se ha impuesto en la visualización de páginas web y es el que todos los navegadores actuales han adoptado.1

El lenguaje HTML basa su filosofía de desarrollo en la diferenciación. Para añadir un elemento externo a la página (imagen, vídeo, script, entre otros.), este no se incrusta directamente en el código de la página, sino que se hace una referencia a la ubicación de dicho elemento mediante texto. De este modo, la página web contiene solamente texto mientras que recae en el navegador web (interpretador del código) la tarea de unir todos los elementos y visualizar la página final. Al ser un estándar, HTML busca ser un lenguaje que permita que cualquier página web escrita en una determinada versión, pueda ser interpretada de la misma forma (estándar) por cualquier navegador web actualizado.

Sin embargo, a lo largo de sus diferentes versiones, se han incorporado y suprimido diversas características, con el fin de hacerlo más eficiente y facilitar el desarrollo de páginas web compatibles con distintos navegadores y plataformas (PC de escritorio, portátiles, teléfonos inteligentes, tabletas, vipers etc. No obstante, para interpretar correctamente una nueva versión de HTML, los desarrolladores de navegadores web deben incorporar estos cambios y el usuario debe ser capaz de usar la nueva versión del navegador con los cambios incorporados. Normalmente los cambios son aplicados mediante parches de actualización automática (Firefox, Chrome) u ofreciendo una nueva versión del navegador con todos los cambios incorporados, en un sitio web de descarga oficial (Internet Explorer). Por lo que un navegador desactualizado no será capaz de interpretar correctamente una página web escrita en una versión de HTML superior a la que pueda interpretar, lo que obliga muchas veces a los desarrolladores a aplicar técnicas y cambios que permitan corregir problemas de visualización e incluso de interpretación de código HTML. Así mismo, las páginas escritas en una versión anterior de HTML deberían ser actualizadas o reescritas, lo que no siempre se cumple. Es por ello que ciertos navegadores todavía mantienen la capacidad de interpretar páginas web de versiones HTML anteriores. Por estas razones, todavía existen diferencias entre distintos navegadores y versiones al interpretar una misma página web.</div>



Final de la Clase

Con esto damos por concluida la Clase/Tutorial. Gracias por pasarse a leer, en caso de tener dudas, tanto del tema como la tarea, posteen a continuación y lo explicare con todo gusto, también posteen si quieren ser un Alumno regular –Explicado en el inicio del tutorial.

Igualmente, no se preocupen si las cosas no les salen a la primera, es normal desesperarse un poco con el HTML, a todo programador, usuario normal y conocedor del HTML, le sucedió cuando empezó a aprender, pero la clave está en perseverar, si no te sale a la primera, date un rato y vuelve a intentar y si aun así tienes problemas, puedes postear aquí tu inconveniente –en lo posible con capturas – para que así pueda darte una mano y explayar más, después de todo tu duda puede tenerlo Fulanito, Panchita, Paquita o Menganito, así que no tengas pena, pero si aun así te incomoda, hazlo en Hide o Spoiler.



Volver arriba Ir abajo

Re: HTML Básico con Hee: 2 Creación de Tablillas - Primeros Pasos para Crear Tablillas Básicas

Mensaje por Tsubasa kurokami el Miér Mayo 18, 2016 8:51 am


Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)


En el foro me sale así, aunque en la pagina donde esta hecho si que me sale con el marco bien puesto, ¿que podría ser?

Spoiler:

Volver arriba Ir abajo

Re: HTML Básico con Hee: 2 Creación de Tablillas - Primeros Pasos para Crear Tablillas Básicas

Mensaje por Hee-Young el Vie Mayo 20, 2016 9:00 pm

De favor, a la próxima pásame el código no como captura, sino en la manera en que lo posteaste, es decir entre [ code ] para que pueda ver bien el error, como ocurrió aquí, porque me fije en tu post, y el problema radica en que le aplicaste el color con un salto de línea

Código:
<div style="width: 300px; max-height: 100px; border: ridge 5px
orange; padding:25px; bacground:#fff; overflow:auto;">

De esa manera la computadora no te reconoce el color que le diste, en este caso el orange. Al crear un code, tiene que estar todo junto, es decir, cada propiedad en una misma línea, y no con un salto de línea, porque lo interpretara como si no fuera parte del codigo, a lo que me refiero, es diferente el poner

Border: ridge 5px orange;

A colocar

Border: ridge 5px
Orange;


De esa manera, lo está asociando con que el orange no es parte del border, lo que te deja un borde invisible. La manera correcta de hacerlo es así.

Código:
<div style="width: 300px; max-height: 100px; border: ridge 5px orange; padding:25px; bacground:#fff; overflow:auto;">

Y te quedara esto de resultado

Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)


Código:
<div style="width: 300px; max-height: 100px; border: ridge 5px orange; padding:25px; bacground:#fff; overflow:auto;">Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)</div>

Siendo que, la unica diferencia que tiene con el tuyo, es lo que te comente del salto de linea


Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)

Código:
<div style="width: 300px; max-height: 100px; border: ridge 5px
orange; padding:25px; bacground:#fff; overflow:auto;">
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
</div>

Espero que eso te ayudara. Si tienes más dudas, o se resolvió el problema, me lo comunicas aquí, en post.

Volver arriba Ir abajo

Re: HTML Básico con Hee: 2 Creación de Tablillas - Primeros Pasos para Crear Tablillas Básicas

Mensaje por Tsubasa kurokami el Sáb Mayo 21, 2016 3:56 pm

OwO entiendo, entonces si le pongo un salto de linea lo tomará como que no es del code, ok~
Muchas gracias por la aclaracion sensei~~ owo/

Aqui la tarea corregida:


Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)

Volver arriba Ir abajo

Re: HTML Básico con Hee: 2 Creación de Tablillas - Primeros Pasos para Crear Tablillas Básicas

Mensaje por Hee-Young el Sáb Mayo 21, 2016 10:10 pm

Muy bien, me alegra que lo comprendieras.
Y por cierto, tienes otro error en el Code, del que no me percate porque solo me señalaste el del border, así que me centre solo en eso.
El fondo de la tablilla que creaste no se está viendo, es decir, le diste un color #FFF que debería ser blanco, pero sigue con el gris del foro, esto se debe a que escribiste mal Background.

Colocaste esto: bacground:#fff
Cuando debiera de ser así: background:#fff
Tu código en realidad, debería de lucir de este modo:

   
Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
   Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
   Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
   Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
   Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
   Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
   Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
   Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
   Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)
   Ejemplo de Tarea 2 de HTML, oh dios mio que original que soy(?)

Volver arriba Ir abajo

Ver el tema anterior Ver el tema siguiente Volver arriba

- Temas similares

 
Permisos de este foro:
No puedes responder a temas en este foro.