Como hacer texto con sombra con CSS

Hola! Hoy les voy a enseñar como hacer texto con sombra como en este post.
Primero necesitan un texto:

TEXTO

Que se hace con:
<div style="position: relative; font-size: 30px; font-family: Verdana;">TEXTO</div>
Y otro, de otro color:
TEXTO
Se hace con:
<span style="color: maroon; font-family: Verdana; font-size: 30px; position: absolute;">TEXTO</span>
Ahora a juntarlos, agregando esto:
<span style="color: maroon; font-family: Verdana; font-size: 30px; top: 2px; left: 2px;">TEXTO</span>
Queda:

TEXTO
  TEXTO

Y así es como se hace. Reemplazar "TEXTO" por lo que quieran!!
Hasta otro día!

Textos con sombra CSS

Esto es solo una demostración:

PRUEBA DE SOMBRA PRUEBA DE SOMBRA

El tutorial viene mañana...

CSS Shapes Border-radius

Hola! Hoy les voy a enseñar como hacer bordes redondeados con CSS, para ello necesitan la propiedad "Border-radius"
 Si ustedes quieren hacer un círculo (por ejemplo) de 100 píxeles de diámetro, primero tienen que hacer un cuadrado de 100 píxeles de diámetro!
Así:
<style>
.circulo {
   width: 100px;
   height: 100px;
   background-color: black;
}
</style>

Y después le tienen que decir que los bordes estén redondeados, así:

<style>
.circulo {
   width: 150px;
   height: 100px;
   background-color: black;
   border-radius: 50px;
}
</style>

Listo! Pero, por qué en "border-radius" puse "50px"? Por que tiene que ser la mitad de la longitud del diámetro!!!
Y si querés hacer un óvalo? Le agrandas la "width" a 150!!!

<style>
.ovalo {
   width: 150px;
   height: 100px;
   background-color: black;
   border-radius: 50px;
}
</style>

Y si querés que cada borde sea distinto? Fácil, le agregas distintas medidas:

<style>
.bordesdistintos {
   width: 150px;
   height: 100px;
   background-color: black;
   border-radius: 50px 10px 40px 30px;
}
</style>

Eso fue todo por hoy! Gracias por leer, ojalá lo hayan entendido!
Tengan un recagorrigodía

Día PI! Pi Day

Hoy es el día PI!!!! Ya saben, del número 3.14!!! Yo me sé 333 decimales del número PI, y son:

3,141592653589793238462643383279502884197169399375105820974944592307816406286208998628034825342117067982148086513282306647093844609550582231725359408128481117450284102701938521105559644622948959430381964428810975665933446128475648233786783165271201909145648566923460348610454326648213373607260249141273724587006606315588174881520920962

Genial, no? Todo de memoria!!! Bueno, como hoy es el día PI, les quería mostrar esto:
 El símbolo de PI
 π
 Y esto:
  CLICK (video)

Y esto:
http://pi.3.14159265358.org/
Se muestran 105.423 decimales (ciento cinco mil cuatrocientos veintitrés)

Y un dato curioso: Solamente con 38 decimales de pi (3.14159265358979323846264338327950288) se puede medir el diámetro del universo ovserbable, con un error de 1 milímetro!!!!!

Y si saben algo más, escribanlo en los comentarios :D

Ha nacido un nuevo blog

Mi amigo dumbledore me prestó su varita: (Pongan el mouse arriba y veran que hace magia! Excepto que tengan INTERNET EXPLORER)

Y me dijo que le haga un blog para él. Acá está su blog: http://elblogdedumbledore.blogspot.com/ Veanlo! Acá les explica de que se va a tratar el blog... BUEN DÍA!!

CSS Shapes Transiciones

Hola! Hoy les voy a enseñar como hacer que las figuras cambien de forma así: (pongan el mouse encima de la figura)

Para ello necesitan tener una figura, en este caso un cuadrado así:

Y eso se logra con este texto:
<style>
.cuadrado {
   height: 30px;
   width: 30px;
   border: solid 1px grey;
}
</style>
<div class="cuadrado"></div>

Ahora, necesitan una figura a la que se transforme. Yo quiero que se transforme a un rectángulo así:

Pero, si yo quiero que el cuadrado se transforme en rectangulo, solamente le tengo que decir que el ancho se agrande (ancho = width).

<style>
.cuadrado:hover {
   width: 60px;
}
</style>

¿Por qué dice "cuadrado:hover"?
"Hover" significa "cuando-pones-el-mouse-encima"
Y le dije que cambie el ancho a 60 píxeles.
Queda así:

Pero... ¿por que es tan "duro"? Por que falta decirle que se agrande de a poco, y no de golpe! Eso se hace agregando esto:

-moz-transition:all 1s;
-webkit-transition:all 1s;
-o-transition:all 1s;
transition:all 1s;

Al texto!!! Nos queda:


<style>
.cuadrado {
   height: 30px;
   width: 30px;
   border: solid 1px grey;

-moz-transition:all 1s;
-webkit-transition:all 1s;
-o-transition:all 1s;
transition:all 1s;

}

.cuadrado:hover {
   width: 60px;
}

</style>
<div class="cuadrado"></div>

Y el resultado:

Ahora solo hay que seguir probando!!!

Introducción a las CSS shapes

Lo primero que tienen que aprender es cómo se forma una figura de CSS:


<style>
texto, muucho texto
</style>

El "texto, muucho texto" es esto:

.triangulo {
   border-color: transparent transparent red transparent;
   border-width: 0px 30px 30px 30px;
   border-style: solid;
   height: 0px;
   width: 0px;
}

Ahora vamos a analizarlo:
.triangulo <--- el nombre de la figura, le podés poner "AAA" si querés!
 { <--- el corchete de apertura, obligatorio


   border-color: transparent transparent red transparent;
   border-width: 0px 30px 30px 30px;                               <------ Las propiedades, dicen como va a ser la
   border-style: solid;                                                                      figura, en este caso un triángulo
   height: 0px;
   width: 0px;

} <--- corchete de "cerramiento", como yo le digo. Obligatorio

Bueno, en total nos queda:
<style>

.triangulo {
   border-color: transparent transparent red transparent;
   border-width: 0px 30px 30px 30px;
   border-style: solid;
   height: 0px;
   width: 0px;
}
</style>

Todo eso es solo para describir la figura: Un triángulo isóceles!!!
Ahora viene la parte de INSERTAR la figura! Le decís donde querés que esté... no se asusten, es fácil!

<div class="triangulo"></div>

Que es eso? Esto:

<div <--- El comienzo de la etiqueta "DIV"

class="triangulo" <--- Le decís que querés que sea todo lo que escribimos antes. Si en todo el texto de antes, donde dice "triangulo" pones "cacasfd", ahora acá tenés que escribir "class="cacasfd"

> <--- Cierra el comienzo de la etiqueta "DIV"

  <--- Nada, ahi dentro puede ir un texto, pero en este caso no.

</div> <--- El final de la etiqueta "DIV"

Bueno, ahora solo hay que crear un gadget llamado "HTML/JAVASCRIPT", y escribir toodo, o sea:

<style>

.triangulo {
   border-color: transparent transparent red transparent;
   border-width: 0px 30px 30px 30px;
   border-style: solid;
}
</style>


<div class="triangulo"></div>

El resultado:

Espero que hayan entendido!! La semana que viene, o mañana viene como hacer que se transformen!!
Hasta mañana, u otro día, quien sabe!

CSS Shapes

Bueno, estas son las figuras de CSS: Pongan el mouse sobre el círculo o sobre el triángulo. Todo eso lo hice solo con texto!!! Para más información vean: Esto y Esto

Espero que les haya gustado

Un reto de códigos...fácil Variación de llamame36

Bueno, el método de cifrado consiste en:

Elegir una clave (en este ejemplo voy a usar "RICH_VALV")
Armar un abecedario con esa clave, primero, a la clave se la hace un proceso que elimina todas las letras repetidas:
RICH_VAL (Ahora no se repite ninguna letra)
Luego, se le agrega el "abececlave" (ABCDEFGHIJJKLMNOPQRSTUVWXYZ_123456789), pero sin las letras que ya están en la clave:
Y nos queda el abececlave final:
RICH_VALBDEFGJKMNOPQSTUWXYZ_1234567890

Luego se escribe el abececlave final al revéz:

0987654321ZYXWUTSQPONMKJGFEDCBLAV_HCIR

Y se le agrega el otro, arriba y queda:
1) 0987654321ZYXWUTSQPONMKJGFEDCBLAV_HCIR
2) RICH_VALBDEFGJKMNOPQSTUWXYZ_1234567890

Ahora, el mensaje a cifrar es "Me voy a china"
El mensaje se transforma a "ME_VOY_A_CHINA"

Y se sustituye primero la "M", buscamos la M en el primer abececlave, y miramos abajo a ver que letra es. En este caso: T
Y así con todas las letras, nos queda:
TZ65QF646879S4
Para más seguridad se puede escribir en columnas:
TF7
Z69
64S
564
Q8

Y se lee en filas:
TF7Z6964S564Q8

Y PARA MAS SEGURIDAD:

Se reemplazan las letras por números:
T F Z S Q
4 1  5  3 2
La primera en el abecedario (normal, abcdefghijklmnopqrstuvwxyz) de las que está arriba es la F, la segunda la Q, tercera la S, cuarta T y quinta Z.
Luego se hace el cubo de cada número:
4= 64
1= 1
5= 125
3= 27
2= 8

Se divide por 10:
64= 6R4
1=0R1
125=12R5
27=2R7
8=0R8
Y se vuelven a agregar al mensaje clave:
6R4 0R1 7 12R5 6964 2R7 564 0R8 8
Y se une:
6R40R1712R569642R75640R88 = Me voy a china

Bueno, ahora decifren este mensaje:
Solo está cifrado por los primeros 2, SIN hacer el proceso de "hacer el cubo, y dividir por 10":
XNZ4MTNZPMMQ49

Les doy el tiempo que quieran!
Tengan un 2ZKS día!!

Trucos Cubo Rubik Rubik's cube patterns

Saben armar el cubo rubik?
Si la respuesta es SI: Sigan leyendo
Si la respuesta es NO: Vayan a ver otra entrada


Bueno!!
Ahora, acá hay unos trucos geniales para el cubo rubik!!!
Si saben notacion completa, entonces... acá esta!:
Truco 1: R u2 U2 r2 R2 B2 r2 R2 u2 U2 F2 R'
Truco 2: R u2 U2 r2 R2 B2 r2 R2 u2 U2 F2 R' R u2 U2 r2 R2 B2 r2 R2 u2 U2 F2 R'

Eso es todo!!!
Si no saben notación ni nada por el estilo, pero tienen un cubo rubik (cubo mágico) pueden ver este video:
http://www.youtube.com/watch?v=wx49JuANCK8

PD: El video no es mío

ES TODO!!!
Que tengan un día recagorrigoerrotacobarrenicoecheisifiquisimo!!

Trollink de twitter

Este es el número 6.670.903.752.021.072.936.960 pero en letras:

Seis mil seiscientos setenta trillones novecientos tres mil setecientos cincuenta y dos billones veintiun mil setenta y dos millones novecientos treinta y seis mil novecientos sesenta.

Palíndromos! Mejor conocidos como "frases capicúas"

Un palíndromo es una frase que se lee igual de los dos lados. Ejemplos:

Roma la luz azul ama luz azul al amor
Sin anis
Reconocer
Sometemos
Alli por la tropa portado traído a ese paraje de maniobras una tipa como capitan usar boina me dejara pese a odiar toda tropa por tal ropilla
Si es nueve ve un seis
¿Subo tu auto o tu autobus?
Anita la gorda no toma, amotona droga latina!
La ruta nos aporto otro paso natural
A mama roma le aviva el amor a papa y a papa roma le aviva el amor a mama
 Se verla al revés
Yo soy augur uruguayo voy allá allá yo voy augur uruguayo soy
entre otros.

Yo los creo y me gusta crearlos! 2 de los que están arriba los creé yo! (los rojos)
Acá hay otros que yo creé:
Enil, no. Adan nada online!
Yo soy alguien que reconoce. Reuqneiugla yo soy!
Palindromo o mordni lap...
Frases... esas "a... se... se... sarf"
A! Ni tocinno! Creo o er con nicotina?
Etel libro orbillete
Adivina ya, nivida!
O yutares encargo o "gracne" sera tuyo.
Ogno perro yo rrepongo
La ruta na droga rto otro paso nos aporto otra gorda natural.
Palindrome emordnilap (que original :P)
Reconocemos some conocer!
Internet... ten, retni
Raluc ricardo, podra circular? (lo hice con mi nombre, si quieren uno con SU nombre, mandanme su nombre por mail o por twitter! mi mail: rickyvalvao@gmail.com)
Ras escribo o bir csesar
Yo vivo o vivo yo?
Eva, sometemos, adan, reconocer nada sometemos ave. Sometemos nada, adan sometemos! Adan, nada nada, adan. Sometemos nada, adan sometemos! Eva sometemos, adan, reconocer nada sometemos ave.

Como dije antes: SI QUIEREN UN PALÍNDROMO, mandenme un mail a rickyvalvao@gmail.com diciendo de que quieren que se trate el palíndromo, y yo voy a ver si lo logro ;)
Si no lo logro, les avisaré y les diré que me manden su nombre a ver si puedo hacer un palíndromo con su nombre.
Estoy deseando que no se llamen brhadaranyakopanishadvivekachudamani ;)

Tengan un buen dia, aid ne ubnu nagnet!

Texto subliminal alias: texto oculto

Un ejemplo de texto oculto sería:

Este JuEgo lo debía usar Mucha gente Para esconder LOs mensajes secretos. (Si mirás las mayúsculas, ves la palabra "EJEMPLO")

Otro ejemplo es la rejilla de cardano http://es.wikipedia.org/wiki/Rejilla_de_Cardano

Se pueden esconder varias palabras:

dE esa forma también se puede Jugar Enviando Mensajes Por papeL O por otro laDo, En la escuela, o donde Tu quiEras! Algunas letras como la "X", son difíciles de esconder, También la i griega, O la equis. (se lee "EJEMPLO DE TEXTO"

Prueba en tu casa algunas formas!!! Yo en twitter casi siempre pongo:

"algo medio esTupido, pero mejor que una consola Wii. está en InterneT y en el TElefono... miRá las mayúsculas!!!  "
                        Ricardo Valvao,
                                                 2012


Hyoh hyo nyoh nyoh!!!

Tengan un buen día!!
Lo desea:

Alguien que (r)encontra conoces s(i) leés este blog (c)ada dí(a)!!! t(r)avieso (d)e chic(o)   :)

Alemán BASICO

Estoy aprendiendo alemán por internet, y quisiera que ustedes también :)
Acá hay algunas cosas BÁSICAS!!!!!
Lo que está entre corchetes [como estos] es la pronunciación de las palabras que aparecen...


Buenos días: Guten tag! [goo-tehn tahg]
Hola, saludo universal. Es informal: Hallo! [jalo]
Yo: Ich [ish]
Buen día (a la mañana), es formal: Guten morgen! [goo-tin morguen]
Buenas noches, es formal e informal: Gute nacht! [goot-teh nuhcht]
Buenas tardes, formal: Guten abend! [goo-tuhn abent]
¿Cómo estás?: Wie geht es dir? [vee gueit s diær]
Bien, gracias (respondiendo): Mir geht es gut, danke [mir gueit s gut, donkeh]
Bien, y tu? (respondiendo): Gut! Und dir? [gut! und diær?]
Gracias: Danke [donkeh]
De nada (respondiendo a "gracias"): bitte [bitteh]
Adiós (formal): Auf wiedersehn [owf vie-der-sein]
Adiós (usado al norte): Tschüss! [chus!]
Adiós (usado al sur): Ciao! (también escrito: tschau) [chaw]
Sí: Ja [ya]
No: nein [nain]
Sr.: Herr [her]
Sra.: Frau [frou]
Srta.: Fräulein [froy-lain] MUY OBSOLETO
No está en casa (si alguien pregunta): Nicht zu hause [niicht tsu hau-zeh]

Números:
1: eins [ains]
2: zwei [tzvai]
3: drei [djai]
4: vier [fiiah]
5: fünf [fonf]
6: sechs [sejs]
7: sieben [siibn]
8: acht [ajt]
9: neun [noin]
10: zehn [tzen]
11: elf [elf]
12: zwolf [tzvolf]

Direcciónes:
Alto! (pare, stop!): anhalten [anhalten]
Irse, marcharse: weggehen [uegehen]
Vete!: Geh weg!/Hau ab! [gue ueg/hau ab]
¿Cuanto cuesta?:Wie viel kostet das? [vie fiel costet das?] ejemplo: Wie viel kostet das saft? Cuanto cuesta ese jugo?
Mi nombre es: Ich heiße [ish heisse] ejemplo: Ich heiße Ricardo, Mi nombre es Ricardo
Lo siento mucho!: Es tut mir sehr leid! [es tut mir sie laid]
Silencio!: Still! [stil]

Otros:
Tienes....??? (ej: tienes jugo???): Haben sie...? [hah-ben sii]
Tú (informal): Du [duu]
Soy: Bin [bin] (HUMOR: no es mr. bean!!!!)
Cuál es tu nombre? (formal): Wie heißen sie? [vie heissen sii]
Cuál es tu nombre? (informal): Wie heißt du? [vie heisst duu]
Y: und [œnd]
Perdón?: Wie bitte? [vii bitteh]
Salúd! (si alguien estornuda): Gesundheit! [gsundhait]
Te amo!: Ich liebe dich [ish leebeh dissh / ik leebe dik (varía según la región)]

Animales:
Perro: der hund [der hand]
Gato: der katze [der catze]


Mañana pongo más cosas...
pero por último:

Seguidores (para twitter): anhänger
¿Qué? (pregunta): Was? [vas?]


GRACIAS POR LEER

Feliz día del maestro pero también del atentado de las torres gemelas

Hoy es el día del maestro pero tambien es el día del atentado de las torres gemelas, se cumplen 11 años.
No tengo mucho para decir.

Prueba de twitter

Como algunos sabrán, tengo twitter (síganme, soy @RValvao)

Quiero hacer una prueba para ver como funcionan los botones estos: 

Twittear

Ok, es una prueba.

Los números felices! y los tristes

Los números felices menores a 500 son:
1, 7, 10, 13, 19, 23, 28, 31, 32, 44, 49, 68, 70, 79, 82, 86, 91, 94, 97, 100, 103, 109, 129, 130, 133, 139, 167, 176, 188, 190, 192, 193, 203, 208, 219, 226, 230, 236, 239, 262, 263, 280, 291, 293, 301, 302, 310, 313, 319, 320, 326, 329, 331, 338, 356, 362, 365, 367, 368, 376, 379, 383, 386, 391, 392, 397, 404, 409, 440, 446, 464, 469, 478, 487, 490, 496.

¿Por qué son felices?
A ver, digamos un número cualquiera y veamos si es feliz o no:

31, por ejemplo.

Lo que hay que hacer, es separar las cifras (si tiene más de 1), calcular el cuadrado de cada una, y sumar. Así hasta que llegues a 1. Si no llegas a 1, el número no es feliz, y es triste :(.

31:
3²+1²=10
1²+0²=1

31 ES feliz.

Ahora con 14:
1²+4²=17
1²+7²=50
5²+0²=25
2²+5²=29
2²+9²=85
8²+.......
y así seguiríamos cada vez con números más y más grandes...
14 NO ES feliz, ES triste.


Calculen la fecha de su cumpleaños y si tienen 3 números felices, serán muy felices en su vida?

Día feliz!

Escribo muy rápido! Si, es cierto!

heyheyheyheyyyy kids!!!

A ver si alguien gana mi record, (que creo que lo van a ganar rapidamente LOL)

Hagan click ACÁ y empiezen a escribir el abecedario lo más rápido que puedan. Mi record es 3.01!!!! Traten de ganarlo!




Tengan un día abcdefghijklmnopqrstuvwxyzisifico!!!


PD: Síganme en Twitter  (soy @RValvao)!!!


Seguir a @RValvao

Feliz día del Zurdo!!!

La gente no sabe que el 13 de agosto es el día del zurdo, pero sabías que:

Paul McCartney es zurdo
Jimi Hendriz era zurdo
Jim Carrey es zurdo
Julia Roberts es zurda
Robert de Niro es zurdo
Charles Chaplin era zurdo
Ned Flanders es zurdo
Diego Maradona es zurdo
Lionel Messi es zurdo
Barack Obama es zurdo
Napoleón Bonaparte es zurdo
y
Ricardo Valvao (yo, dueño de este blog) es zurdo!!!!

Todas esas personas que son MUY conocidas, son zurdas!!!!
(bueno, yo no soy tan conocido, pero yo me conozco a mí!)

Feliz día a todos los zurdos!!!!

Mnemotecnia

Busquen en Google si no saben lo que significa. JA

Bueno, como no hay muchas tecnicas para historia quise poner las mías, para que la gente las conozca!!!

Bueno, primera tecnica:

Integrantes de la primera junta de Argentina:

PSA (pesa)
SMP (semp)
VAABCLM (vaabecelm, suena como "babearse")

Total: pesa semp vaabecelm
¿Que es?
PSA: Presidente: SAavedra
SMP: Secretarios: Moreno y Paso

VAABCLM: Vocales: Azcuénaga, Alberti, Belgrano, Castelli, Larrea, Matheu

Segunda técnica:
primer triunvirato:
Me como el chicle, zapateo y paso.
(Chiclana, Sarratea y Paso)

Tercera técnica:
segundo triunvirato:

Paso por el Monte mientras escucho a Peña en la radio

(Jonte, Paso, Peña)

luego, el triunvirato cambió a
Hay un Perezoso en el Monte mientras escucho a Peña en la radio
luego, cambió a:
Hay un Perezoso Posado en mi radio, en la que escucho a Peña!!!
(Posadas, Pérez, Peña)
luego, cambió a:

Posadas tiene Diarrea, que Peña!!
(Posadas, Larrea, Peña)

Ojalá les sirva.

PD: Los triunviratos y la primera junta son de ARGENTINA