Página principal  |  Contacto  

Correo electrónico:

Contraseña:

Registrarse ahora!

¿Has olvidado tu contraseña?

.мαяισlleттe eмpιяe.
 
Novedades
  Únete ahora
  Panel de mensajes 
  Galería de imágenes 
 Archivos y documentos 
 Encuestas y Test 
  Lista de Participantes
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
 
 
  Herramientas
 
★ σғғ тσριc: ★ Tutoriales para el Rol! [Música, ID, etc]
Elegir otro panel de mensajes
Tema anterior  Tema siguiente
Respuesta  Mensaje 1 de 70 en el tema 
De: Lyricalia  (Mensaje original) Enviado: 23/02/2011 04:49

Aquí pondremos todo lo que es código o ideas que pueden funionar para hacer el rol más interesante, o más ordenadou~ Yo partiré con:

oo1. Poner Música en tu mensaje <3 Cómo hacer esto, mis puppeteers? Pues es muy fácil!
OJO: Sólo funciona con videos de youtube, asique la url debe ser de ahí, sip? +w+ 

Esto hará el reproductor invisible, y la canción sonará una vez nada más, porque no recuerdo el código para hacerlo replay *shot'ed* Gomen neh ~ D:

1. El video que yo pondré es este! La parte de la url en blanco la deben copiar de su url, pero solo esa parte después del "=" : http://www.youtube.com/watch?v=
A8YDaIThjco

2. Una vez terminado el post, apretarás el botón que dice "html" y verás la sarta de código. Vamos hasta el final (recuerda siempre salvar o copiar tu post por si internet se pone inteligente contigo!), y copias-pegas el siguiente código ;3 

{object width="1" height="1" data="http://www.youtube.com/v/A8YDaIThjco?fs=1&hl=es_ES&rel=0&autoplay=1" type="application/x-shockwave-flash"} {param name="data" value="http://www.youtube.com/v/A8YDaIThjco?fs=1&hl=es_ES&rel=0&autoplay=1" /} {param name="src" value="http://www.youtube.com/v/A8YDaIThjco?fs=1&hl=es_ES&rel=0&autoplay=1" /}{param name="allowfullscreen" value="true" /} {/object}   


NOTA: Reemplazar los { } por < >! Y cuida de no borrar los "?" y demás ;3 

Y listo! Quedará al final como un puntito de 1x1 px, asique yo hago trampa y lo pongo al final de mi post, como el punto final,muahah. Espero se emocionen y nos cuenten también el cuento con música de fondo como, en mi opinión, el mundo debe ser, kora! haha, cualquier duda no duden en avisar nuestra gente
~ <3



Primer  Anterior  26 a 40 de 70  Siguiente   Último 
Respuesta  Mensaje 26 de 70 en el tema 
De: ♥ suĸι ♥ Enviado: 20/08/2011 03:10
La mejor opcion para combatir el html!! es descargarse el "FRONT PAGE" 2003 0 2007 
hacemos las cosas como en msn groups original! mas sencillo n.n
y luego copias el codigo html para copiarlo ;) y de paso aprendes a leerlo =)
un pequeño consejo .-

Ese es mi aporte. adoro esa cancion, aunque me gusta mas la version CHARM! ;)
kisses.

Respuesta  Mensaje 27 de 70 en el tema 
De: Cherry-tan Enviado: 10/10/2011 00:26
Para los que quieren usar el lay de papiro para la biografía de sus marionetas como está usada en la de Nichts y etc, la subí en los documentos :,DDD~
Aunque le arreglé unas cosillas, y ahora en lugar de estar en tablas esta en un solo div! Está listo para escribir, y allí dentro dejé unas cuantas explicaciones del html, ya que es mejor modificar las cosas allí que en el wysiwyg. Es algo más complicado pero es mejor O,:
Así que eso, está más limpio ouo y usé la bio de Lulú como base |D~
Claro que ustedes pueden hacer la bio como quieran, pero esta es una ayudita :,DD~

biopapiro.txt

 

Respuesta  Mensaje 28 de 70 en el tema 
De: Shounen Kait Enviado: 11/10/2011 00:07
Como se hace para poner las letras con sombreados y todas grandotas y raras como ultimamente se usa? .o. en post you biography or die! tambien esta el titulo de esa forma, para que no entiendo como es el codigo en si : S alguien sabe explicarme?

Respuesta  Mensaje 29 de 70 en el tema 
De: Cherry-tan Enviado: 11/10/2011 00:51
Para las sombras tienes que usar el siguiente código, cambiando los [] por < >~
[span style="text-shadow: -3px 3px 1px #6459fa;"]Aqui tu texto[/span]
Aqui tu texto
El primer -3px es para determinar la distancia de la sombra horizontalmente hacia la derecha. Como le puse en negativo será hacia la izquierda.
El segundo 3px es para determinar la distancia de la sombra verticalmente hacia abajo. Si le pones números negativos se va hacia arriba.
Y el tercero es para determinar el blur/desenfoque de la sombra
Luego le puedes cambiar el tipo de letra, tamaño, color y etc~
Espero te ayude ´u`;

Respuesta  Mensaje 30 de 70 en el tema 
De: Shounen Kait Enviado: 11/10/2011 01:08
Gracias Cherry, sos un amor finalmente entiendo esa cosa xD

Respuesta  Mensaje 31 de 70 en el tema 
De: Emily Dream Enviado: 11/10/2011 05:22
.................................................. x_____x mi no entender! solo se poner lays xD y muy apenas me tomo 5 dias y lo tengo ke hacer otra ves TT_TT

Respuesta  Mensaje 32 de 70 en el tema 
De: Kαѕαяυ-cнαи Enviado: 07/11/2011 03:01
;3; Quien ayuda a esta alma en pena y le dice como poner un lay? Tengo galletas de recompensa (?)

Respuesta  Mensaje 33 de 70 en el tema 
De: Cherry-tan Enviado: 01/12/2011 04:29
Wah, explicaré como subir un lay simple x,D! Recuerden que en el código que les pongo tienen que reemplazar los [] por <>~

Hay varias formas de montar layus: con tablas, divs, templates, etc~
Yo aquí les enseñaré como sé con divs, ya que pueden haber otras formas (ya con el css sheet, clases y demás...)

Entonces, un div es como una 'caja', o una 'capa' (me acorde de los JFrames en Java x,D). Estas cajas pueden contener muchas cosas dentro, como texto, imágenes, y hasta otras cajas más!
Pero bueno! Aquí subiré un lay demasiado simple y feo, casi ni editado ya que estoy super oxidada en eso x,D Así que usaré como uno o dos divs simplemente~ pero los divs que pueden usar pueden ser los que quieran y con lo que deseen! Como dije que son como 'capas', pueden ponerlos uno encima del otro, como las capas en photoshop y eso~ y en este caso sería la capa que esta escrita más abajo la que está más encima.

Subiré este layu:  (pic original de pixiv)
El layu tiene estas dimensiones: 650x588. Entonces, creo un [div] con parámetro style que tenga como atributos de fondo la imag del layu, y que tenga esas dimensiones~ Width es para el ancho, y height es para el alto, y cada atributo va separado por punto y coma.

[div style="width:650px; height:588px; background-image:url(http://i159.photobucket.com/albums/t139/Stellita-san/layugasshu.png);"]Aquí iría tu texto~[/div]

Y hasta ahora sólo tienen el layu puesto y pueden escribir lo que quieran dentro de los tags ^0^~

--pero eso no queremos, queremos que escriba dentro del cuadrito que hice exclusivamente para escribir u_u Para eso, hay que crear o~tro div más! Pero este será como el div que grey explicó unos mensajes antes, con el scroll y eso~
Bueno, conocemos el tamaño del cuadrito donde vamos a escribir y dónde queda ubicado, verdad? Entonces, así mismo, abrimos otro tag [div style=""] con el tamaño que necesitemos, y esta vez no necesitamos ponerle color/imagen de fondo, pero sí la posición y los demás atributos para que funcione el scroll.
En este punto también es recomendable que le pongan los atributos de tipo de letra que quieran! Para que dentro del div no se llene de código basura que sale en cada línea pero realmente es el mismo!
Poniéndole los atributos en el div hace que todo lo que esté dentro de esa caja tenga esos atributos, y no solo la línea/párrafo, y si le quieren cambiar el estilo a todo el cuadro, simplemente lo cambian en un sólo lugar y se cambia todo sin problema :,D~ Pueden cambiarle luego los estilos con [span style=""] pero sólo en lo que necesitan y no a cada rato~

Entonces, el código estaría quedando así:

[div style="width:650px; height:588px; background-image:url(http://i159.photobucket.com/albums/t139/Stellita-san/layugasshu.png);"]
[div style="width: 325px; height: 280px; text-align: justify; padding-right: 3px; float: left; margin: 31px; overflow: auto; font-family: 'verdana'; font-size: 10px; color: white;"]Aquí iría tu texto~[/div]
[/div]


Donde pueden ya empezar a escribir normalmente :,D
Ahora, explicando un poco el código...  el text-align:justify; es para justificarlo; debemos ponerle también el atribujo de float:left; porque luego el div estaría 'pegado' al div de atrás y no podría ser libre como el viento (?);
El margin:31px; es para ubicarlo; como está con float left el numerito se sumará desde la izquierda, si estuviese float right se sumaria de la derecha, y si ponemos números negativos se va hacia el lado contrario. También pueden poner los atributos de cada margen por separado, margin-top, margin-right, margin-bottom, margin-left, con sus respectivos valores; o uno compuesto margin: 10px 20px 10px 20px;, donde los valores tienen el mismo orden que el anterior.
El overflow: auto; es para que ponga los scrollbars sólo si lo necesita, y donde lo necesite, para que el texto no se salga del cuadrito. El padding-right es para hacer que tenga un poco de espaciado entre el espacio de escritura y el borde (de la derecha, del lado del scroll). Y el font-family, font-size, color y demás son ya propiedades del texto.

Y básicamente eso es todo :,D! El layu está subido! Y quedó como lo que está abajo, con dummy text y eso~
Recuerden que esta es una de las formas de subir un layu; pude no haber usado dos divs sino solo el del fondo, o usando tablas~ Además que en internet pueden encontrar más ejemplos y atributos bonitos para ponerle~
Si tienen dudas pregunten :,D Y espero haberme hecho explicar bien ;U;


Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin nec diam sapien, eget sodales urna. Donec ac nunc id augue dictum accumsan. Sed tristique ligula vitae urna facilisis ullamcorper. Curabitur molestie porttitor gravida. Curabitur tempor, lectus sed venenatis molestie, odio nisi feugiat est, et blandit ante eros ac enim. Pellentesque aliquet orci blandit tortor tincidunt quis lacinia mauris eleifend. Praesent porta risus porttitor eros facilisis viverra.

Morbi ac libero urna. Suspendisse blandit auctor venenatis. Aliquam in massa ipsum, molestie viverra urna. Morbi lobortis orci vitae diam lobortis sit amet faucibus erat porttitor. Phasellus vitae nisi odio, sit amet dapibus leo. Vestibulum lacinia mattis lectus, vitae lacinia nisl blandit a. Cras consectetur luctus quam, nec fermentum purus mollis non. Nullam lacinia tortor ut eros pellentesque blandit. Nunc bibendum tristique neque ac placerat. In elit nunc, venenatis sit amet porta eget, pulvinar ut neque. Praesent sit amet est ante. Pellentesque imperdiet rutrum malesuada.

Maecenas vitae lectus quis dui posuere varius. Suspendisse lectus mauris, porttitor quis ornare eu, facilisis at odio. In at risus massa. Duis lacinia orci ut lectus lobortis ultrices. Curabitur vel leo ac tellus egestas vestibulum quis sed justo. Ut porttitor tempus velit, vitae cursus orci feugiat sit amet. Fusce nec justo ac enim congue fermentum. Curabitur in nisi nec sem viverra luctus. Nulla imperdiet, dolor vel tincidunt varius, lectus lorem tempor orci, a adipiscing lectus nibh at purus. Nulla malesuada est quis diam commodo nec vehicula nunc blandit. Mauris porta, nisl at feugiat porta, risus elit interdum sem, ultrices pellentesque tortor lacus ac lorem.

Maecenas eu commodo sapien. Etiam bibendum feugiat dolor eu pulvinar. Curabitur fermentum arcu blandit dolor hendrerit viverra. Praesent elementum sem ac ligula consectetur eget auctor nulla vestibulum. Duis tempor, augue sed sodales dictum, nulla orci blandit sapien, sagittis eleifend nunc tellus eget leo. Nulla at consequat ipsum. Suspendisse consequat aliquam velit, sed tincidunt odio bibendum eget. Integer tortor ligula, posuere at commodo sit amet, tristique sed sem. Nulla gravida, leo eget consequat sodales, diam erat blandit lorem, ut vestibulum urna magna vitae purus. Curabitur in neque magna, ut imperdiet nibh.

Respuesta  Mensaje 34 de 70 en el tema 
De: Cherry-tan Enviado: 05/04/2012 16:04
Bueno, este tutorial tratará sobre los estilos~!
ya saben, reemplazan los [] por <>

Antes que nada, hay que saber que hay varios elementos/tags que se usan aquí, como el [a] para los links, [img] para las imágenes, [p] para párrafos, [div] para las cajitas, [span] para cosas comunes, [b] o [strong] para negrita, [i] o [em] para itálica, y así
A todos y cada uno de estos elementos se les puede cambiar el estilo, ya sea en la hoja de estilos CSS, o colocando los estilos directamente en cada tag como un atributo style. Y cuando digo a todos, es porque es a todos.

Hagamos una prueba~
Con el CSS que viene default en GG, los links (o lo que se ponga dentro del tag [a]) salen de esta forma, azules subrayados si no han sido visitados, y eso a algunos les molesta o no les gusta.
Pero si le cambiamos los estilos dentro del tag [a], por ejemplo: ya no quiero que sea subrayado, que sea itálica, con color y tipo de letra distinto, y que tenga un subrayado muy personalizado (quiero que sea de puntitos! y de otro color!). El código para que funcione eso quedará más o menos así

[a style="text-decoration:none; font-style:italic; color:#cc92ff; font-family:'courier new'; border-bottom:dotted 1px #dd5980;" target="_blank" href="aquítuenlace"]aquí el texto[/a]

y el enlace se vería de esta manera!

Y así los links se ven personalizados ;D lo malo es que hay que agregar todo ese código cada vez que quiera cambiar el estilo... Por eso es bueno trabajar con el CSS :,D


Ahora, uno de los problemas mayores aquí en GG es que cada vez que le agregamos un estilo, este estilo crea un tag nuevo innecesario, y entonces quedan acumulados muchos tags; que si era de un color y se le volvió a cambiar de color, luego de un tamaño pequeño se lo hizo más grande, negritas que son del grosor normal, cosas así.
Entonces, algo así (tomado de una sección de la comu)
.MARIOLLETTE EMPIRE

en realidad es así
[strong style="font-family: consolas; font-size: 11px; letter-spacing: 2px; "][span style="font-weight: normal; "][span style="color: rgb(153, 51, 102); "].MARIOLLETTE EMPIRE[/span][/span][/strong]

y pudo ser escrito tranquilamente así, con un solo tag
[span style="font-family: consolas; font-size: 11px; letter-spacing: 2px; color: #993366;"].MARIOLLETTE EMPIRE[/span]

Cosas así se llegan a ver, y por eso los códigos se ensucian, y pueden llegar a acumularse tanto que de los nosecuantos caracteres que GG les permite en el mensaje, más de la mitad sean estos tags que se abren y cierran, y existen, pero que no se ven.
Así que les recomiendo que sean ecológicos (?!!). No dejen que GG abra tags que no son necesarios, acumúlenlos todos en un solo tag, y el resto bórrenlo. Así mantenemos limpio nuestro código, y nuestra comunidad uwu *este es un mensaje del Ministerio de Salud Pública y Medio Ambiente (????)*

... no es que esté diciendo que usar muchos tags es malo, no no~ A veces es necesario para dar distintos estilos, como este:
esta es una frase subrayada
donde la frase cambió de color, pero el underline sigue del mismo color. El código se ve así:
[u style="color:#336600;"][span style="color:#b39348;"]esta es una frase[/span] subrayada[/u]

Y creo que eso! Hay muchos valores que se pueden cambiar dentro del atributo style para hacer las cosas con el estilo que quieran~
Espero haberme hecho entender ;u; Si tienen una duda pregunten aquí mismo C,: a reciclar♫ (?)

Respuesta  Mensaje 35 de 70 en el tema 
De: Cherry-tan Enviado: 20/05/2012 22:13
Hm, el código para poner los avatares a un costado sin necesidad de usar tablas, como estoy escribiendo ahorita, al menos el que yo suelo usar, es el siguiente:

[div style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"][img src="http://i159.photobucket.com/albums/t139/Stellita-san/leilavy.png" alt="" /][/div]
[div style="font-size: 10px; font-family: verdana; color: #b45a52;"]TU TEXTO AQUI[/div]


Yo uso dos divs distintos: un div para la imagen, donde la tengo flotando a la izquierda, con separación del margen hacia la derecha y hacia abajo, y 'bloqueé' que cosas se metan a su izquierda; y el otro div es donde puedo escribir, con el estilo de texto que quiero, tipo de letra, color, tamaño, eso. Luego pueden usar las etiquetas de span para darle un estilo distinto a partes del texto~
Pero en realidad lo importante aquí es el float que está en el div de la imagen.

Luego están las tablas~ Que esas las recomiendo tratarlas solo en el editor nuevo de GG xd ahí es más fácil personalizar el espaciado y si quieren fusionar celdas y eso~
para que el avatar quede fijo en la parte de arriba y no se quede en la mitad, se tienen que ir al código, y en el td que está donde pusieron la imagen, deben agregarle valign="top", así:

[table border="0" cellspacing="0" cellpadding="0"]
[tbody]
[tr]
[td valign="top"][img src="http://i159.photobucket.com/albums/t139/Stellita-san/leilavy.png" alt="" /][/td]
[td] [div style="font-size: 10px; font-family: verdana; color: #b45a52;"]Aqui tu texto~[/div]
[/td] [/tr] [/tbody] [/table]


y algo así quedaría xd
 
Aqui tu texto~

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin nec diam sapien, eget sodales urna. Donec ac nunc id augue dictum accumsan. Sed tristique ligula vitae urna facilisis ullamcorper. Curabitur molestie porttitor gravida. Curabitur tempor, lectus sed venenatis molestie, odio nisi feugiat est, et blandit ante eros ac enim. Pellentesque aliquet orci blandit tortor tincidunt quis lacinia mauris eleifend. Praesent porta risus porttitor eros facilisis viverra. Morbi ac libero urna. Suspendisse blandit auctor venenatis. Aliquam in massa ipsum, molestie viverra urna. Morbi lobortis orci vitae diam lobortis sit amet faucibus erat porttitor. Phasellus vitae nisi odio, sit amet dapibus leo. Vestibulum lacinia mattis lectus, vitae lacinia nisl blandit a. Cras consectetur luctus quam, nec fermentum purus mollis non. Nullam lacinia tortor ut eros pellentesque blandit. Nunc bibendum tristique neque ac placerat. In elit nunc, venenatis sit amet porta eget, pulvinar ut neque. Praesent sit amet est ante. Pellentesque imperdiet rutrum malesuada. Maecenas vitae lectus quis dui posuere varius. Suspendisse lectus mauris, porttitor quis ornare eu, facilisis at odio. In at risus massa. Duis lacinia orci ut lectus lobortis ultrices. Curabitur vel leo ac tellus egestas vestibulum quis sed justo. Ut porttitor tempus velit, vitae cursus orci feugiat sit amet. Fusce nec justo ac enim congue fermentum. Curabitur in nisi nec sem viverra luctus. Nulla imperdiet, dolor vel tincidunt varius, lectus lorem tempor orci, a adipiscing lectus nibh at purus. Nulla malesuada est quis diam commodo nec vehicula nunc blandit. Mauris porta, nisl at feugiat porta, risus elit interdum sem, ultrices pellentesque tortor lacus ac lorem. Maecenas eu commodo sapien. Etiam bibendum feugiat dolor eu pulvinar. Curabitur fermentum arcu blandit dolor hendrerit viverra. Praesent elementum sem ac ligula consectetur eget auctor nulla vestibulum. Duis tempor, augue sed sodales dictum, nulla orci blandit sapien, sagittis eleifend nunc tellus eget leo. Nulla at consequat ipsum. Suspendisse consequat aliquam velit, sed tincidunt odio bibendum eget. Integer tortor ligula, posuere at commodo sit amet, tristique sed sem. Nulla gravida, leo eget consequat sodales, diam erat blandit lorem, ut vestibulum urna magna vitae purus. Curabitur in neque magna, ut imperdiet nibh.

Y creo que más o menos así sería! Si tienen alguna duda, por favor hacerla saber ;u;!!

Respuesta  Mensaje 36 de 70 en el tema 
De: Cherry-tan Enviado: 30/12/2012 18:14
Este tutorial será algo extenso por necesidad xd Hablaré un poco sobre los identificadores y para qué podrían servir~ Ya saben, los { } por < > !

Índice
Atributo id
Diferencias entre id y class
Links con ids
Link futuro!
Atributo id

Al codificar, dentro de cualquier tag podemos incluir un atributo id, el cual le dara 'nombre' al elemento, y podrá ser encontrado fácilmente. Ej:

{span id="textoprueba"}Este es un texto de prueba con nombre!{/span}

El id, como dije, sirve para darle un nombre a un elemento, y puede servir para localizar elementos y ser manipulados específicamente por el Javascript. Este nombre tiene que ser único en la página actual! Luego el intérprete se confunde porque vienen varios elementos con el mismo nombre y no sabe a cual afectar! (creo que en realidad afecta a todos, pero así no debería funcionar~)
Diferencias entre id y class

Aparte del id también existe el atributo class, que es casi lo mismo, pero este sí está dirigido a varios elementos a la vez. El atributo id y class pueden ser definidos en el CSS, y los estilos que se le dieron allí serán afectados por todos los que lleven ese nombre. Por ejemplo, en el css de ME hice una clase TextoSecciones que tiene el estilo de las cajas de texto de las secciones de la comu~ se vería más o menos así:
Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ultrices posuere viverra. Nulla malesuada tortor ac diam imperdiet tempus vel a lectus. Aenean id nunc ut turpis fringilla iaculis. Pellentesque magna nisi, lobortis fringilla condimentum in, dictum et lacus. Duis velit nisl, imperdiet at tincidunt a, sagittis eu felis. Suspendisse potenti. Nunc mi massa, tincidunt id pulvinar vitae, mattis a leo. Nunc id ipsum eget felis varius aliquam eget a elit. Aliquam ut ligula ut urna porta pretium. Phasellus dapibus nunc in diam iaculis non semper libero porta. Sed non lacus dolor, vitae tincidunt massa. Praesent sit amet purus a arcu porttitor condimentum. Etiam est sem, aliquet eu eleifend sollicitudin, congue quis dui. Nullam mollis condimentum nisl vel congue.

Morbi eu dolor metus, et pulvinar quam. Nunc mauris sapien, pellentesque id varius a, mattis vitae tortor. Nullam in metus sit amet lectus accumsan venenatis. Suspendisse sed purus nisl. Proin purus leo, faucibus vehicula dictum in, malesuada vitae metus. Sed dictum metus pulvinar magna posuere varius. Proin egestas accumsan consequat.

Sed tempor ligula vitae erat condimentum lobortis. Duis metus ligula, ullamcorper quis cursus sed, gravida sed metus. Duis viverra, dui ut faucibus suscipit, elit enim convallis ligula, quis placerat elit felis sed ipsum. Sed sit amet dui nisi. Maecenas lacus eros, commodo non tincidunt vitae, placerat sed purus. Nullam magna leo, vulputate sed consequat ut, porta ut nisi. Donec euismod, purus ut feugiat adipiscing, risus mauris consectetur sapien, eget euismod neque dui sed nunc. Praesent id velit ut urna semper euismod auctor vel risus. Curabitur sodales neque et lacus aliquam posuere. Morbi ut purus nisi. Suspendisse eget sapien purus, quis laoreet dolor. Sed vestibulum, purus sit amet semper convallis, eros felis luctus velit, et eleifend felis tortor quis enim. Nam vehicula, velit nec sagittis dignissim, ante sapien auctor nunc, vel rutrum ante tortor ac erat.

Duis non ligula arcu, sit amet volutpat metus. Cras posuere velit ac tortor lacinia ut auctor mauris ullamcorper. Sed faucibus eros eget tellus rutrum tincidunt. Ut tincidunt gravida auctor. Duis porttitor imperdiet eros porta sodales. Ut volutpat vulputate facilisis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae;

Suspendisse aliquet mauris sit amet turpis cursus elementum. Pellentesque accumsan eros sed metus pretium a aliquam arcu ultrices. Donec tellus ipsum, facilisis sed facilisis a, iaculis vel augue. Duis at urna diam. Nam eget nibh nisi, sit amet lacinia velit. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vivamus ut lacus id tortor euismod fringilla vitae nec orci. Integer placerat volutpat sem, in congue dui eleifend sit amet. Suspendisse tellus neque, egestas id iaculis nec, egestas nec mi. Etiam a metus nisl. Nulla viverra arcu ut turpis mattis iaculis auctor est bibendum. In hac habitasse platea dictumst. Nulla facilisi. Etiam iaculis vulputate nisl, vitae pulvinar orci facilisis ut. Duis rhoncus tempor ligula. Ut quis tortor rhoncus nulla consequat venenatis sed et odio.
(en el preview no se ve, pero ahí está xd como la ventana de preview no tiene el css de la página principal entonces no se ve xd)
Todos los elementos que tengan esa clase tendrán ese estilo.

La diferencia más importante entre los ids y las clases es que un elemento puede tener varias clases asignadas, pero un solo identificador. Es como un estudiante~ tiene distintas clases, pero su nombre/número de matrícula es único en todos lados.
Links con ids

Uno de los usos más fáciles de los ids es para enlazar cosas en el mismo documento! Como en la página de Wikipedia con sus índices~ He ahí la razón de la estructura del mensaje, por si no se dieron cuenta xdd
Por ejemplo, si quiero enlazarme a una parte con identificador de este mismo mensaje tengo que usar simplemente un hiperlink dirigido hacia el identificador. Para hacerlo, en la url debe ponerse el nombre del identificador predecido de #, así:

{a target="_blank" href="#indice"}cualquier texto{/a}
cualquier texto
nos llevará a la parte inicial de este mensaje!

para ir a un identificador en otra página se pone el link hacia la otra página y seguido de # y el nombre del identificador!

Link futuro.- En realidad lo enlazaré a un mensaje posterior a este, para que vean que sí sirve ouo! O si uds prefieren hacer el mensaje con el id, lo pueden hacer! Con tal que encuentre el identificador no hay problema~ (eso quiere decir que sólo funciona en ésta página O:). El identificador es linkFuturo~

Esto puede servir para cuando en un mensaje quieren ir poniendo distintas cosas en mensajes posteriores, pero que sean accesadas desde el mensaje principal~ Aunque realmente no sé si funcione para posts que estén distintas páginas dentro del mismo mensaje... orz
También, por eso los identificadores deben ser únicos! Luego el intérprete no sabe a dónde ir! Aunque supongo que va al primero que encuentre...Tengan en cuenta eso!

(no logré que los links dejen de abrir una página distinta ;u; orz)

Bueno, creo que es algo complicado esto xd pero es muy útil! Si tienen dudas de todo esto (lo anterior también xd) me preguntan o miren los tutoriales de la W3 que son los que saben todo sobre esto *q*/

Respuesta  Mensaje 37 de 70 en el tema 
De: Lyricalia Enviado: 31/12/2012 23:20
dgalkdgas me encanta que siempre pongas tutos!! Muchas veces
me han salvado de caer en histeria ahaha.
Demo, Cherry-chan, no entendí muy bien la utilidad de este último?
 
Es decir, si yo tengo un primer mensaje y quiero accesar...que? 
Unf, perdón!! Me explicarías mejor?
Tankyuu~
~Tammy

Respuesta  Mensaje 38 de 70 en el tema 
De: Cherry-tan Enviado: 01/01/2013 17:48
Pues~, como en el mensaje anterior, dejé un enlace al ~Link futuro~, prediciendo que voy a usar el identificador en un mensaje posterior, por ejemplo este! Entonces, escribo el identificador en cualquier parte de este mensaje...

por ejemplo aquí
{span id="linkFuturo"}por ejemplo aquí{/span}


y al dar click en el Link Futuro en el mensaje anterior nos llevará justo ahí^ !

Algo parecído sería al usarlo en un mensaje principal, definiendo los identificadores que usarás, y en post posteriores(?) usar los identificadores para enlazar directamente a esos posts y no confundirse con el resto de posts~

--pero aún no sé cómo hacer para que los links no abran automáticamente una ventana, y tampoco creo que funcione si el mensaje tiene varias páginas/tiene más de 15 posts, así que no creo que sea muy útil haha...

También podría servir para enlazar a posts específicos, por ejemplo enlazar al post 50 de un mensaje de 300 posts~ pero estuve revisando y los mensajes no tienen identificadores xd (creo que en msng si tenían?)

así que no... creo que sirvan mucho haha... orz
o al menos que esté haciendo algo mal aquí, pero en otros lados sí podría servir ;u;/ orz
Espero haberme hecho entender ;u;/ orz 

Respuesta  Mensaje 39 de 70 en el tema 
De: Lyricalia Enviado: 11/01/2013 18:51
Ahora si entendi!! Sankyuu ~ LPer no se si es usted (no creo *la sube a un pedestal*), si no que GG tiene varios atributos distintos a GMSN, mucho que dan libertad, otros que... aun no están. Asi que no se desanime #bearhug


Voy a intentar hacer el lay como usted subió antes...en mi epoca (se me cae el carneeet de ID ahha) no teníamos tanto uso de html, como ahora en grupos... nos la arreglabamos como podíamos, y por eso inventamos tantas cosas locas para poder juntar un lay.

A ver si me resulta!!

Ne ne, Cherry-chan, usted sabe como se pueden cambiar las propiedades (color, forma, algo?) del scroll bar de nuetsros lays? o hay anda que me haga sangrar la vista más que esas cosas gruesas y grises y que no van con el diseño (?)

Orz.
~Tammy

Respuesta  Mensaje 40 de 70 en el tema 
De: Cherry-tan Enviado: 11/01/2013 23:49
haha siii x,D no se puede tener todo a la vez u___u

Y sí se pueden cambiar los scrollbars! Pero cambiarían to~~dos los de la comu/página web, no hay cómo cambiarlos uno por uno (y si es que hay forma, creo que es demasiado engorrosa xd)

Aquí explican muy bien! http://almaer.com/blog/creating-custom-scrollbars-with-css-how-css-isnt-great-for-every-task
Se puede modificar con solo colores, o también con imágenes!

Para los scrollbars básicos con solo colores, se tendría que pegar esto en el CSS de la comu, claro, modificándole los colores, y los tamaños/bordes redondeados si se quiere xd


/* Turn on a 13x13 scrollbar */
::-webkit-scrollbar {
    width: 13px;
    height: 13px;
}
 
::-webkit-scrollbar-button:vertical {
    background-color: red;
    border: 1px dashed blue;
}
 
/* Turn on single button up on top, and down on bottom */
::-webkit-scrollbar-button:start:decrement,
::-webkit-scrollbar-button:end:increment {
    display: block;
}
 
/* Turn off the down area up on top, and up area on bottom */
::-webkit-scrollbar-button:vertical:start:increment,
::-webkit-scrollbar-button:vertical:end:decrement {
    display: none;
}
 
/* Place The scroll down button at the bottom */
::-webkit-scrollbar-button:vertical:increment {
    background-color: black;
    border: 1px dashed blue;
}
 
/* Place The scroll up button at the up */
::-webkit-scrollbar-button:vertical:decrement {
    background-color: purple;
    border: 1px dashed blue;
}
 
::-webkit-scrollbar-track:vertical {
    background-color: blue;
    border: 1px dashed pink;
}
 
/* Top area above thumb and below up button */
::-webkit-scrollbar-track-piece:vertical:start {
    border: 1px solid #000;
}
 
/* Bottom area below thumb and down button */
::-webkit-scrollbar-track-piece:vertical:end {
    border: 1px dashed pink;
}
 
/* Track below and above */
::-webkit-scrollbar-track-piece {
    background-color: green;
}
 
/* The thumb itself */
::-webkit-scrollbar-thumb:vertical {
    height: 50px;
    background-color: yellow;
}
 
/* Corner */
::-webkit-scrollbar-corner:vertical {
    background-color: black;
}
 
/* Resizer */
::-webkit-scrollbar-resizer:vertical {
    background-color: gray;
}

y así tendríamos nuestro scrollbar lindo y hasta minimalista como los otros foros tienen /o/(?)

realmente sí pensé ponerlo aquí haha x,D pero no sé qué pasó y lo olvidé xdd


Primer  Anterior  26 a 40 de 70  Siguiente   Último 
Tema anterior  Tema siguiente
 
©2024 - Gabitos - Todos los derechos reservados