Archives : Août 2016 - Tutorial, CSS, HTML

Par GloriaV dans Texto movimiento le 13 Août 2016 à 18:08
— Doctor! ¿Cuanto tiempo puede vivir una persona sin cerebro? — Calculemos, ¿Que edad tiene Usted?

<marquee style="border:#FF4500 2px SOLID">— Doctor! ¿Cuanto tiempo puede vivir una persona sin cerebro? — Calculemos, ¿Que edad tiene Usted?</marquee>

Par GloriaV dans Texto le 13 Août 2016 à 18:03

Texto

<blockquote style="box-shadow: rgba(0,0,0,0.2) 0px 1px 3px;border-radius: 5px;
border-left: #ffdddd 5px solid; border-right: #ffdddd 5px solid;padding: 25px;
 border-top: #ff88aa 5px solid; border-bottom: #ff88aa 5px solid; ">
<span style="color: #3b948d; font-family: Arial; font-size: medium;">Texto
</span><img src="https://img-fotki.yandex.ru/get/63842/112265771.9e1/0_ccf18_79b7c8d2_S" 
alt="" align="right" /></blockquote>

Par GloriaV dans Texto le 13 Août 2016 à 18:02

Una vida feliz consiste en tener tranquilidad de espíritu. Cicerón

<blockquote style="box-shadow: rgba(0,0,0,0.2) 0px 1px 3px;border-radius: 5px;
border-left: #E5B489 5px solid; padding: 25px; border-top: #EFBE75 5px solid; 
border-bottom: #F9AA7F 5px solid; border-right: #FAE87F 5px solid;">
<span style="color: #000000; font-family: Arial; font-size: 16px;">
Texto</span><br /><img src="http://ekladata.com/vZrt3MAgISl6_22bq6MpLOJD5yE.gif" 
alt="" align="left" /></blockquote>

Par GloriaV dans Texto le 13 Août 2016 à 18:00

Donde hay éxito hubo antes una decisión valiente.

<blockquote style="box-shadow: rgba(0,0,0,0.2) 0px 1px 3px;border-radius: 5px;
padding: 25px;border-left: #22ccee 5px solid; border-right: #22ccee 5px solid;
  border-top: #bbffcc 5px solid; border-bottom: #bbffcc 5px solid; ">
<span style="color: #b34055; font-family: Arial; font-size: 19px;">
Texto</span><br /><img src="http://dl6.glitter-graphics.net/pub/2957/2957046m8jlwegrz0.gif"
alt="" width="59" height="49" align="left" /></blockquote>

Par GloriaV dans Texto le 13 Août 2016 à 17:59

La verdadera educación consiste en invocar dentro de vosotros lo mejor de vosotros mismos. ¿Qué libro mejor puede existir que el libro de la humanidad? Mahatma Gandhi

<p><img src="http://img1.liveinternet.ru/images/attach/c/2/82/875/82875957_defne1.gif"
 alt="" align="left" /><span style="color: #880000; font-family: Arial; 
font-size: 16px;">La verdadera educaci&oacute;n
<img src="http://img1.liveinternet.ru/images/attach/c/2/82/875/82875957_defne1.gif" 
alt="" align="right" /> consiste en invocar dentro de vosotros lo mejor de 
vosotros mismos. &iquest;Qu&eacute; libro mejor puede existir que el libro 
de la humanidad? Mahatma Gandhi</span></p>

Par GloriaV dans Texto le 13 Août 2016 à 17:58

1. El maquillaje que embellece más es una sonrisa sincera.

<fieldset>
    <legend><img src="http://i.skyrock.net/0311/40250311/pics/3001605101_1_5_PfnWQqsH.gif" 
align="absmiddle" alt="" width="110" height="130"  />
1. El maquillaje que embellece más es una sonrisa sincera.</legend>
</fieldset>

Par GloriaV dans Texto le 13 Août 2016 à 11:19

2. La alegría de ver y entender es el más perfecto don de la naturaleza.Albert Einstein

Marco se extiende por toda la anchura de la escritura

<fieldset>
    <legend><img src="http://ekladata.com/fWbPNYn0hKvPh8mkKfywiYlisKg.gif" 
alt="" /></legend>Texto<br /><br />
Marco se extiende por toda la anchura de la escritura
</fieldset>

Par GloriaV dans Texto le 13 Août 2016 à 11:18

Una vez le preguntaron a Buda qué es lo que a él más le sorprendía de la humanidad, y respondió: Los hombres, que pierden la salud para juntar dinero, y luego pierden el dinero para recuperar la salud y por pensar ansiosamente en el futuro, olvidan el presente de tal forma, que acaban por no vivir ni el presente ni el futuro, viven como si nunca fuesen a morir y mueren como si nunca hubiesen vivido.

<blockquote style="box-shadow: rgba(0,0,0,0.2) 0px 1px 3px; border-radius: 5px;
 padding: 25px; border-left: #B587C6 3px double; border-right: #B587C6 3px double; 
border-top: #C43988 3px solid; border-bottom: #C43988 3px solid;">
<span style="color: #000000; font-family: Oleo Script; font-size: 15px;">
Texto</span><br />
<p><embed type="application/x-shockwave-flash" width="230" height="200" 
src="http://www.msieflash.com/xx/15/rfs176.swf" wmode="transparent" 
autostart="1" loop="loop"></embed></p></blockquote>

Par GloriaV dans Texto le 13 Août 2016 à 11:16

Texto preformateado

<pre> texto preformateado</ pre>

Soportes de texto preformateado. Si envuelve alrededor de este texto, que va a seguir la forma del texto en el código – es decir, sin formato extra tiene que poner pulg Si tienes espacio que en su código, éste aparecerá espaciadas en la página.

<samp> Textos de ejemplo</ samp>

Se utiliza para mostrar un ejemplo en pantalla, por lo general de una salida de un programa, un script, etc. Es similar en uso a la etiqueta <code>.

<code> código</ code>

Establece el texto como código, se usa mucho en páginas como esta, para ejemplos de código fuente.

Citas y Referencias

<blockquote>cita larga</ blockquote>

Sangría todo el bloque de texto de ambas partes y añade saltos de línea superior e inferior. Se utiliza para citas largas.

<cite>cita</ cite>

Muestra una cita (el título de una obra a la que estás haciendo referencia, por ejemplo).

<q>citas pequeñas</q>

Se usa para entrecomillar una cita pequeña. A diferencia de <blockquote>, no presenta el texto en un bloque separado sino que sigue el flujo normal de la página.

<dfn> definición</ dfn>

Pues eso, para formatear un texto en HTML como una definición.

<abbr>abreviaturas</ abbr>

Denota una abreviatura, utilizar el atributo title para darle el significado completo.

<acronym>acrónimos</ acronym>

Lo mismo que la anterior. Sólo que en lugar de para abreviaturas se usa para acrónimos.

Tarjetas con letra mediaval elegante
Par GloriaV dans Texto le 13 Août 2016 à 11:15

1. Texto <u>1. Texto</u>

2.Texto <s>2.Texto</s>

3. Texto <strike>3. Texto</strike>

4. Texto^{más arriba}4.Texto<sup> más arriba</sup>

5. SuperindicesTexto   Superindices<sub> 5. Texto</sub>

6. Texto   <h6>6. Texto</h6>

7. Texto   <h2>7. Texto</h2>

8. Texto <h1>8. Texto</h1>

9. Texto en negrilla   <b>9. Texto en negrilla</b>

10. Te amo <sub>10. Te amo</sub>

11. Texto en cursiva <i>11. Texto en cursiva</i>

12. Texto
- A la derecha <div align="right">12. Texto</div>- A la derecha
13. Texto - Centro   <div align="justify">13. Texto</div>- Centro 14. Texto o imagen - Centro <center>14. Texto o imagen</center>- Centro
15. Texto <blockquote>15. Texto</blockquote>

<hr /> - Linea separadora

<p>Texto</p> Nueva linea
Par GloriaV dans Texto le 13 Août 2016 à 11:14
Me encanta que hablen a mi espalda porque eso significa que voy por delante de ellos.

<div style="border:3px solid #105a99;"> <p style="border:1px solid #d9b8c5;margin:10px;"> Texto </p> </div>

Par GloriaV dans Texto le 13 Août 2016 à 11:12

Texto 1...
Texto 2..

Тexto 3</<WBR>font>

<span style="font-size: 30px;"><font face="Comic Sans MS">
<font color="#FF0000">T</font></font></span>exto 1...<br />
<span style="font-size: 30px;"><font face="Monotype Corsiva">
<font color="#0000FF">T</font></font></span><font face="Monotype Corsiva">
exto 2..</font><br />
<br />
<font style="font-size:7pt;">Тexto 3&lt;/&lt;WBR&gt;font&gt;</font><br />
<br />

Par GloriaV dans Texto le 13 Août 2016 à 11:11

GloriaV La felicidad, en la mayor parte de las personas alegres, es
el resultado de una tenaz disciplina.

La sonrisa es el único virus que no hace daño al alma.

<fieldset style="width: Xpx; border-color: #C35AAD;
 border-radius: 115px 115px 15px 15px; box-shadow: 2px 2px 20px #000000;">
<fieldset style="height: Xpx; border-color: #D9436F; border-radius: 
115px 115px 15px 15px; box-shadow: 2px 2px 20px #000000;"><legend>GloriaV 
&nbsp;</legend>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
Texto<br />Texto<br /><br />Texto</fieldset></fieldset>

Par GloriaV dans Texto le 13 Août 2016 à 11:10

GloriaVTexto

<fieldset style="width: Xpx; margin: 10px 40px; border-color: #71E1EF; 
border-radius: 15px 15px 15px 15px; box-shadow: 2px 2px 20px #000000;">
<legend>GloriaV</legend>Texto</fieldset>

Par GloriaV dans Texto le 13 Août 2016 à 11:09

GloriaV Texto

<fieldset style="width: Xpx; margin: 10px 40px; border-color: #438CFF; 
border-radius: 30%; ovale horizontal;box-shadow: 2px 2px 20px #000000;">
<legend><br /> GloriaV</legend> Texto</fieldset>

Par GloriaV dans Texto le 13 Août 2016 à 11:09

<h2>
    <script language="JavaScript1.2" type="text/javascript">
//<![CDATA[

    /*
    Neon Lights Text
    By JavaScript Kit (http://javascriptkit.com)
    For this script, TOS, and 100s more DHTML scripts,
    Visit http://www.dynamicdrive.com
    */

    var message="Welcome to Dynamic Drive!"
    var neonbasecolor="magenta"
    var neontextcolor="yellow"
    var flashspeed=100  //in milliseconds

    ///No need to edit below this line/////

    var n=0
    if (document.all||document.getElementById){
    document.write('<font color="'+neonbasecolor+'">')
    for (m=0;m<message.length;m++)
    document.write('<span id="neonlight'+m+'">'+message.charAt(m)+'<\/span>')
    document.write('<\/font>')
    }
    else
    document.write(message)

    function crossref(number){
    var crossobj=document.all? eval("document.all.neonlight"+number) : document.getElementById("neonlight"+number)
    return crossobj
    }

    function neon(){

    //Change all letters to base color
    if (n==0){
    for (m=0;m<message.length;m++)
    //eval("document.all.neonlight"+m).style.color=neonbasecolor
    crossref(m).style.color=neonbasecolor
    }

    //cycle through and change individual letters to neon color
    crossref(n).style.color=neontextcolor

    if (n<message.length-1)
    n++
    else{
    n=0
    clearInterval(flashing)
    setTimeout("beginneon()",1500)
    return
    }
    }

    function beginneon(){
    if (document.all||document.getElementById)
    flashing=setInterval("neon()",flashspeed)
    }
    beginneon()


    //]]>
    </script>
</h2>

Par GloriaV dans Texto le 13 Août 2016 à 11:07

Texto dinamico

<script type="text/javascript">
//<![CDATA[
<!--
// HEADER FADER ANIMATION (c) 2004-2009 Angus Turnbull http://www.twinhelix.com
function HeaderFader(tagName, colors)
{
        this.tagName = tagName; // Pass "h1" or similar.
        this.colors = colors; // An array of colours in order.
        this.left = true; // false for right-aligned.
        this.frames = 20;
        this.elements = [];
 
        var obj = this;
        if (window.addEventListener) {
                window.addEventListener('load', function() {
                        obj.setup();
                }, false);
        } else {
                var oldOnload = window.onload;
                window.onload = function() {
                        if (oldOnload) oldOnload();
                        obj.setup();
                }
        }
};
 
HeaderFader.prototype.setup = function() {
        this.elements = document.getElementsByTagName(this.tagName);
        for (var h = 0; h < this.elements.length; h++) {
                var h1 = this.elements[h],
                        text = h1.firstChild.nodeValue;
                h1.removeChild(h1.firstChild);
                h1.animNodes = [];
                for (var i = 0; i < text.length; i++) {
                        var span = document.createElement('span');
                        span.appendChild(document.createTextNode(text.substring(i, i+1)));
                        h1.appendChild(span);
                        h1.animNodes[h1.animNodes.length] = span;
                }
                h1.animCount = 0;
                var obj = this;
                h1.animTimer = setInterval((function(hh) {
                        return function() {
                                obj.animate(hh);
                        }
                }(h)), 50);
        }
};
 
HeaderFader.prototype.animate = function(h) {
        var h1 = this.elements[h], c = h1.animCount++, noAnim = 1;
        for (var i = 0; i < h1.animNodes.length; i++) {
                var s = h1.animNodes[i],
                        pc = (this.left ? (c-i) : (c-(h1.animNodes.length+this.frames-i))),
                        frac = Math.max(0, Math.min(1, pc/this.frames)),
                        marg = document.all && !window.opera ? 'marginRight' : 'marginLeft';
                if (s.animDone) continue;
                noAnim = 0;
                s.style.color = this.colors[Math.floor(frac * 0.99999 * this.colors.length)];
                if (frac == 1) {
                        s.style[marg] = '0';
                        s.animDone = 1;
                } else {
                        s.style[marg] = 0.6*(1-frac) + 'em';
                }
        }
        if (noAnim) {
                clearInterval(h1.animTimer);
        }
        h1.style.visibility = 'inherit';
};
 
// SCRIPT SETUP
if (document.documentElement)
{
        // Hide H1 elements for animation and trigger show on load.
        document.write('<style type="text/css"> h1 { visibility: hidden } <\/style>');
        // Off we go!
        var h1Anim = new HeaderFader(
                'h1',
                ['#FFFFFF', '#803DD1', '#3D6AD1', '#3DD1CA', '#777777', '#555555']
        );
        //h1Anim.left = true; // Try setting to false if using text-align: right;
        //h1Anim.frames = 10;
}
-->
//]]>
</script>

Par GloriaV dans Texto le 13 Août 2016 à 11:06

<h2 id="fly">Thanks for visiting$Dynamic Drive!</h2>
 
<script type="text/javascript">
 
//Flying Letters script- by Matthias (info@freejavascripts.f2s.com)
// Modified by Twey for efficiency and compatibility
//For this script and more, visit Dynamic Drive: http://www.dynamicdrive.com
 
//Configure message to display. Use "$" for linebreak
//By default, set to just grab the text from element with ID="fly"
message = document.getElementById("fly").innerHTML; // $ = taking a new line
distance = 50; // pixel(s)
speed = 200; // milliseconds
 
var txt="",
num=0,
num4=0,
flyofle="",
flyofwi="",
flyofto="",
fly=document.getElementById("fly");
 
 
function stfly() {
for(i=0;i != message.length;i++) {
if(message.charAt(i) != "$")
txt += "<span style='position:relative;visibility:hidden;' id='n"+i+"'>"+message.charAt(i)+"<\/span>";
else
txt += "<br>";
}
fly.innerHTML = txt;
txt = "";
flyofle = fly.offsetLeft;
flyofwi = fly.offsetWidth;
flyofto = fly.offsetTop;
fly2b();
}
 
function fly2b() {
if(num4 != message.length) {
if(message.charAt(num4) != "$") {
var then = document.getElementById("n" + num4);
then.style.left = flyofle - then.offsetLeft + flyofwi / 2;
then.style.top = flyofto - then.offsetTop + distance;
fly3(then.id, parseInt(then.style.left), parseInt(then.style.left) / 5, parseInt(then.style.top), parseInt(then.style.top) / 5);
}
num4++;
setTimeout("fly2b()", speed);
}
}
 
function fly3(target,lef2,num2,top2,num3) {
if((Math.floor(top2) != 0 && Math.floor(top2) != -1) || (Math.floor(lef2) != 0 && Math.floor(lef2) != -1)) {
if(lef2 >= 0)
lef2 -= num2;
else
lef2 += num2 * -1;
if(Math.floor(lef2) != -1) {
document.getElementById(target).style.visibility = "visible";
document.getElementById(target).style.left = Math.floor(lef2);
} else {
document.getElementById(target).style.visibility = "visible";
document.getElementById(target).style.left = Math.floor(lef2 + 1);
}
if(lef2 >= 0)
top2 -= num3
else
top2 += num3 * -1;
if(Math.floor(top2) != -1)
document.getElementById(target).style.top = Math.floor(top2);
else
document.getElementById(target).style.top = Math.floor(top2 + 1);
setTimeout("fly3('"+target+"',"+lef2+","+num2+","+top2+","+num3+")",50)
}
}
 
stfly()
 
</script>

Par GloriaV dans Texto le 13 Août 2016 à 11:05

<script language="JavaScript1.2" type="text/javascript">
//<![CDATA[
 
 
var message="* * Bienvenido  * *"
var neonbasecolor="blue"
var neontextcolor="red"
var flashspeed=100  //in milliseconds
 
///No need to edit below this line/////
 
var n=0
if (document.all||document.getElementById){
document.write('<font color="'+neonbasecolor+'">')
for (m=0;m<message.length;m++)
document.write('<span id="neonlight'+m+'">'+message.charAt(m)+'<\/span>')
document.write('<\/font>')
}
else
document.write(message)
 
function crossref(number){
var crossobj=document.all? eval("document.all.neonlight"+number) : document.getElementById("neonlight"+number)
return crossobj
}
 
function neon(){
 
//Change all letters to base color
if (n==0){
for (m=0;m<message.length;m++)
//eval("document.all.neonlight"+m).style.color=neonbasecolor
crossref(m).style.color=neonbasecolor
}
 
//cycle through and change individual letters to neon color
crossref(n).style.color=neontextcolor
 
if (n<message.length-1)
n++
else{
n=0
clearInterval(flashing)
setTimeout("beginneon()",1500)
return
}
}
 
function beginneon(){
if (document.all||document.getElementById)
flashing=setInterval("neon()",flashspeed)
}
beginneon()
 
 
//]]>
</script>

Par GloriaV dans Texto le 13 Août 2016 à 11:04

<!-- Presentado por truco95.jimdo.com -->
<script language="JAVASCRIPT" type="text/javascript">
//<![CDATA[
TE1="Con mejores deseos.GloriaV";
TE2="";
M=TE1;
cnt=0;
function SH(){
document.Switch.A.value=M;
cnt++;
if(cnt==1 && M==TE1){M=TE2;}
if(cnt==2 && M==TE2){cnt=0;M=TE1;}
setTimeout("SH()",500);
}
// -->
//]]>
</script>
<form name="Switch" id="Switch">
    <div align="center">
        <center>
            <p>
                <font color="#008000" face="Verdana"><input name="A" 
size="50" style=
                "color: #770EF3; font-weight: bold; font-family: 
Verdana, Arial; background-color: rgb(255,255,255); 
border: 0px outset rgb(0,128,0); margin-top: auto; padding-left: 5px" />
</font>
                <script language="JAVASCRIPT" type="text/javascript">
//<![CDATA[

                <!--
                SH();
                // -->
                //]]>
                </script>
            </p>
        </center>
    </div>
</form>

1 2 3 4 5 6 7 8

6. Texto <h6>6. Texto</h6>

7. Texto <h2>7. Texto</h2>

8. Texto <h1>8. Texto</h1>