Como hacer fade texto en CSS

La creación de fotogramas clave en CSS permite animar cualquier parte de su página Web. Una vez que se crea fotogramas clave en la hoja de estilo, que estén disponibles para su reutilización en tantos elementos de la página que desee. Fading texto en CSS requiere un código de fotogramas clave que establece la opacidad a plena en un punto en la animación y la cambia a una total transparencia en otro punto.

Contenido

Video: css3: efecto fade en evento :hover
Video: estilizar letra
Consejos advertencias

Abra la hoja de estilo para su página Web en el Bloc de notas o un editor de código. Si la página Web no tiene todavía una, crear un archivo en blanco y guardarlo como “style.css”. Añadir esta línea después de la “”Etiquetas en el código HTML de su página web para añadir la hoja de estilo:</p><p><link rel=”stylesheet” href=”path/to/style.css” type=”text/css” /></p><p>Cambio “ruta / a / style.css” a la ruta del archivo que conduce a la hoja de estilos.</p> </li><li><p>Crear una animación de fotogramas clave en la hoja de estilo utilizando la siguiente sintaxis:</p><p>@keyframes fade-texto {<br/>0%, 100% {<br/>}<br/>50% {<br/>}<br/>}</p><H2 id="i-1">Video: CSS3: Efecto fade en evento :hover</H2><iframe width="100%" height="315" src="https://www.youtube.com/embed/GzZRPdKKHLY" frameborder="0" allowfullscreen></iframe><p>Añadir propiedades CSS como “color” o “opacidad” dentro de las llaves junto a los porcentajes. Cada número de porcentaje en el fotograma clave representa una posición dentro de la animación, o un fotograma clave. Ajuste de la posición de inicio y finalización de las mismas propiedades que permite al bucle de la animación sin problemas.</p> </li><li><script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script><ins class="adsbygoogle" style="display:block; text-align:center;max-width:700px;" data-ad-layout="in-article" data-ad-format="fluid" data-ad-client="ca-pub-3962743005094080" data-ad-slot="2973273272"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({});</script><p>Ajuste cada fotograma clave a una opacidad diferentes:</p><p>@keyframes fade-texto {<br/>0%, 100% {</p><pre class="markdown-pre"><code> opacidad: 1-</code></pre><p>}<br/>50% {</p><pre class="markdown-pre"><code> opacidad: 0-</code></pre><p>}<br/>}</p><p>Al hacer que la “opacidad” igual a uno para el comienzo y el final de esta animación, lo haces iniciar y detener a toda la opacidad. Una opacidad cero en la marca de 50 por ciento se desvanece la animación por completo a mitad de camino pasante configurarlo en valores decimales de punto como “0.5” si no desea que la animación se convierta siempre invisible.</p> </li><li><p>Escribir una nueva regla de estilo para el texto que desea hacer una animación de la decoloración en:</p><span class="markdown-h1">fading_text {</span><p>}</p><p>En el ejemplo, “#fading_text” es un selector de ID que encuentra ninguna etiqueta en la página con un ID de “fading_text.” Abra su página Web y mirar el código para encontrar o añadir un ID para las etiquetas que rodean el texto. Añadir etiquetas como esto si usted necesita etiquetas: <span id=”fading_text”>texto que desee animar</span>.</p> </li><li><p>Llame a la animación de fotogramas clave dentro de la regla de estilo:</p><span class="markdown-h1">fading_text {</span><p>animación: 10s fundido de entrada de texto infinite-<br/>}</p><H2 id="i-2">Video: estilizar letra</H2><iframe width="100%" height="315" src="https://www.youtube.com/embed/xBhW2EHWwpQ" frameborder="0" allowfullscreen></iframe><p>El primer valor es el nombre de su fotograma clave, seguido de la duración en segundos y luego un tipo de repetición. Una repetición infinita bucles de la animación una y otra reemplazar nuevo- esto con un número entero como “10” para especificar un número finito de bucles.</p> </li><li><p>Ir a través y duplicar tanto la animación de fotogramas clave y los de sus llamadas a la animación. Debe tener una copia del código con el prefijo “webkit” y otra copia con el prefijo “-moz” para hacer el código compatible con Chrome, Safari y Firefox:</p><p>@ Webkit-fotogramas clave fundido de texto {<br/>0%, 100% {</p><pre class="markdown-pre"><code> opacidad: 1-</code></pre><script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script><ins class="adsbygoogle" style="display:block; text-align:center;max-width:700px;" data-ad-layout="in-article" data-ad-format="fluid" data-ad-client="ca-pub-3962743005094080" data-ad-slot="2973273272"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({});</script><script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script><ins class="adsbygoogle" style="display:block;width:100%;height:300px;max-width:700px;" data-ad-client="ca-pub-3962743005094080" data-ad-slot="5843587349" data-ad-format="link"></ins><script>(adsbygoogle = window.adsbygoogle || []).push({});</script><p>}<br/>50% {</p><pre class="markdown-pre"><code> opacidad: 0-</code></pre><p>}<br/>}<br/>@ -moz-fotogramas clave fundido de texto {<br/>0%, 100% {</p><pre class="markdown-pre"><code> opacidad: 1-</code></pre><p>}<br/>50% {</p><pre class="markdown-pre"><code> opacidad: 0-</code></pre><p>}<br/>}</p><span class="markdown-h1">fading_text {</span><p>-webkit-animación: 10s fundido de entrada de texto infinite-<br/>-MOZ-animación: 10s fundido de entrada de texto infinite-<br/>}</p> </li></ul></span><span class="step fl" style="width: 100%"><span class="stepMeat"> </span></span></section><span class="mod tips-warnings clearfix wo-border" data-module="tips-warnings"><H2 id="i-3">Consejos advertencias</H2><span class="tips FLC"><ul class="items"><li class="item headline5 tip">Voltear ajustes de opacidad en sus fotogramas clave por lo que el primer fotograma clave tiene una opacidad cero y el segundo tiene opacidad completa. Esto hace que el fundido de texto en la página.</li></ul></span><span class="warnings FLC"><ul class="items"><li class="item headline5 warning">En Internet Explorer 9 y navegadores continuación, el texto no se animará. Esto se debe a que los navegadores no son compatibles con las animaciones de fotogramas clave. Sin embargo, el texto aparece en la página.</li></ul></span></span> </section><div class="addthis_native_toolbox"></div> <div id="ads"><script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script><ins class="adsbygoogle" style="display:inline-block;width:580px;height:400px" data-ad-client="ca-pub-3962743005094080" data-ad-slot="8497062693"></ins><script>(adsbygoogle = window.adsbygoogle || []).push({});</script> <div id="M567013ScriptRootC882680"></div><script src="https://jsc.mgid.com/m/a/maniqui.ru.882680.js" async></script></div></div><div class="related-post"><div class="widget-title h3">Artículos Relacionados </div><div class="col-md-6"><div class="single-article clearfix"><figure><a class="img-hyperlink" href="https://howbored.ru/educación/33162-cómo-citar-una-oración-en-formato-mla.html" title="Cómo citar una oración en formato MLA">Cómo citar una oración en formato MLA</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="https://howbored.ru/tech/72209-cómo-crear-un-opt-out-para-el-correo-electrónico.html" title="Cómo crear un Opt-Out para el correo electrónico">Cómo crear un Opt-Out para el correo electrónico</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="https://howbored.ru/negocio/98746-cómo-crear-un-formulario-en-html-y-tener.html" title="Cómo crear un formulario en HTML y tener resultados en un archivo de texto">Cómo crear un formulario en HTML y tener resultados en un archivo de texto</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="https://howbored.ru/finanzas-personales/118770-cómo-encontrar-el-código-sic-de-una-compañía.html" title="Cómo encontrar el código SIC de una compañía específica">Cómo encontrar el código SIC de una compañía específica</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="https://howbored.ru/tech/120817-cómo-poner-juegos-en-una-página-web-html.html" title="Cómo poner juegos en una página Web HTML">Cómo poner juegos en una página Web HTML</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="https://howbored.ru/tech/120927-cómo-configurar-una-página-principal-de-google.html" title="Cómo configurar una página principal de Google">Cómo configurar una página principal de Google</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="https://howbored.ru/tech/120941-cómo-hacer-una-bandera-para-un-sitio-con-css.html" title="Cómo hacer una bandera para un sitio con CSS">Cómo hacer una bandera para un sitio con CSS</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="https://howbored.ru/tech/145015-cómo-aplicar-y-cabecera-números-de-página-en-apa.html" title="Cómo aplicar y cabecera números de página en APA estilo de escritura">Cómo aplicar y cabecera números de página en APA estilo de escritura</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="https://howbored.ru/negocio/194729-cómo-imprimir-etiquetas-diferentes-en-una-sola.html" title="Cómo imprimir Etiquetas diferentes en una sola hoja">Cómo imprimir Etiquetas diferentes en una sola hoja</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="https://howbored.ru/arte-y-entretenimiento/218146-cuáles-son-dibujos-para-vehículos-en-animación-2d.html" title="¿Cuáles son dibujos para vehículos en Animación 2D?">¿Cuáles son dibujos para vehículos en Animación 2D?</a></figure></div></div><div class="col-md-6"><div class="single-article clearfix"><figure><a class="img-hyperlink" href="https://howbored.ru/tech/241243-cómo-obtener-un-objeto-de-seguir-un-camino-en.html" title="Cómo Obtener un objeto de seguir un camino en Adobe After Effects">Cómo Obtener un objeto de seguir un camino en Adobe After Effects</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="https://howbored.ru/negocio/244740-cómo-corregir-un-error-de-sintaxis-jsp.html" title="Cómo corregir un error de sintaxis JSP">Cómo corregir un error de sintaxis JSP</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="https://howbored.ru/tech/265178-cómo-quitar-ms-word-mso-etiquetas-de-html.html" title="Cómo quitar MS Word MSO etiquetas de HTML">Cómo quitar MS Word MSO etiquetas de HTML</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="https://howbored.ru/negocio/267442-cómo-crear-logos-uso-de-vistaprint.html" title="Cómo crear Logos Uso de Vistaprint">Cómo crear Logos Uso de Vistaprint</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="https://howbored.ru/negocio/290611-cómo-crear-logos-de-texto.html" title="Cómo crear logos de texto">Cómo crear logos de texto</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="https://howbored.ru/negocio/292855-cómo-convertir-texto-en-código-de-barras.html" title="Cómo convertir texto en código de barras">Cómo convertir texto en código de barras</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="https://howbored.ru/tech/313197-cómo-crear-un-botón-personalizado-en-php.html" title="Cómo crear un botón personalizado en PHP">Cómo crear un botón personalizado en PHP</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="https://howbored.ru/carreras-y-trabajo/341227-cómo-hacer-un-fotograma-clave-en-final-cut-pro.html" title="Cómo hacer un fotograma clave en Final Cut Pro">Cómo hacer un fotograma clave en Final Cut Pro</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="https://howbored.ru/negocio/364747-cómo-crear-una-tarjeta-con-plantillas-de-avery.html" title="Cómo crear una tarjeta con plantillas de Avery">Cómo crear una tarjeta con plantillas de Avery</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="https://howbored.ru/tech/384621-cómo-hacer-que-la-figura-del-palillo-animaciones.html" title="Cómo hacer que la figura del palillo Animaciones con Flash">Cómo hacer que la figura del palillo Animaciones con Flash</a></figure></div></div><div class="clearfix"></div><script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script><ins class="adsbygoogle" style="display:block;max-width:700px" data-ad-format="autorelaxed" data-ad-client="ca-pub-3962743005094080" data-ad-slot="3524184640"></ins><script> (adsbygoogle = window.adsbygoogle || []).push({});</script></div></article></div></main><aside class="widget-area col-sm-12 col-md-4" role="complementary" id="sidebar-secondary" itemscope="itemscope" itemtype="http://schema.org/WPSideBar"><section class="widget widget_text"><div class="textwidget"><script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script><ins class="adsbygoogle" style="display:block;width:100%;height:300px;max-width:300px;" data-ad-client="ca-pub-3962743005094080" data-ad-slot="5843587349" data-ad-format="link"></ins><script>(adsbygoogle = window.adsbygoogle || []).push({});</script><div id="M567013ScriptRootC882689"></div><script src="https://jsc.mgid.com/m/a/maniqui.ru.882689.js" async></script><div class="single-article clearfix"><figure><a class="img-hyperlink" href="/tech/265345-cómo-transferir-datos-desde-un-iphone-viejo-a-un.html" title="Cómo transferir datos desde un iPhone viejo a un nuevo iPhone">Cómo transferir datos desde un iPhone viejo a un nuevo iPhone</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="/tech/217262-cómo-bloquear-ultrasurf.html" title="Cómo bloquear Ultrasurf">Cómo bloquear Ultrasurf</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="/tech/169078-cómo-eliminar-informe-de-errores-de-sistema-en.html" title="Cómo eliminar Informe de errores de sistema en cola de Windows">Cómo eliminar Informe de errores de sistema en cola de Windows</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="/tech/289327-cómo-sincronizar-thunderbird-con-un-iphone.html" title="Cómo sincronizar Thunderbird con un iPhone">Cómo sincronizar Thunderbird con un iPhone</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="/tech/120975-cuál-es-la-definición-de-fraude-en-internet.html" title="Cuál es la definición de Fraude en Internet?">Cuál es la definición de Fraude en Internet?</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="/tech/241365-por-qué-es-oscuro-mi-pantalla-de-ordenador.html" title="¿Por qué es oscuro Mi pantalla de ordenador portátil?">¿Por qué es oscuro Mi pantalla de ordenador portátil?</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="/tech/360861-cómo-descargar-música-en-una-unidad-flash.html" title="Cómo descargar música en una unidad flash">Cómo descargar música en una unidad flash</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="/tech/384802-cómo-construir-un-recinto-con-puerto-sub.html" title="Cómo construir un recinto con puerto Sub">Cómo construir un recinto con puerto Sub</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="/tech/96546-cómo-quitar-el-ruido-estático-desde-un-teléfono.html" title="Cómo quitar el ruido estático Desde un teléfono inalámbrico">Cómo quitar el ruido estático Desde un teléfono inalámbrico</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="/tech/313214-recuperación-de-mensajes-eliminados-de-los-blogs.html" title="Recuperación de mensajes eliminados de los blogs">Recuperación de mensajes eliminados de los blogs</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="/tech/72366-cómo-hacer-la-impresión-del-guepardo-en-photoshop.html" title="Cómo hacer la impresión del guepardo en Photoshop">Cómo hacer la impresión del guepardo en Photoshop</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="/tech/23854-cómo-sincronizar-amigos-en-twitter-y-facebook.html" title="Cómo sincronizar amigos en Twitter y Facebook">Cómo sincronizar amigos en Twitter y Facebook</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="/tech/193250-cómo-cambiar-el-color-de-fondo-en-corel-draw.html" title="Cómo cambiar el color de fondo en Corel Draw?">Cómo cambiar el color de fondo en Corel Draw?</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="/tech/72365-cómo-crear-un-bloque-de-título-en-autocad-lt.html" title="Cómo crear un bloque de título en AutoCAD LT">Cómo crear un bloque de título en AutoCAD LT</a></figure></div><div class="single-article clearfix"><figure><a class="img-hyperlink" href="/tech/384801-cómo-morph-formas-en-after-effects.html" title="Cómo morph formas en After Effects">Cómo morph formas en After Effects</a></figure></div><script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script><ins class="adsbygoogle" style="display:inline-block;width:300px;height:600px" data-ad-client="ca-pub-3962743005094080" data-ad-slot="5184503643"></ins><script>(adsbygoogle = window.adsbygoogle || []).push({});</script></div></section></aside> </div>  </div>  </div>  <footer class="site-footer" id="footer" role="contentinfo" itemscope="itemscope" itemtype="http://schema.org/WPFooter"> <div class="footer-widget"> <div class="container"> <div class="row"> <div class="footer-block col-md-3"> <aside class="sidebar sidebar-subsidiary1" role="complementary" id="sidebar-subsidiary1" itemscope="itemscope" itemtype="http://schema.org/WPSideBar"> <section id="text-2" class="widget widget_text"> <div class="widget-title font-headlines h3">Publicacion reciente</div> <ul id="menu-more-themes" class="menu font-secondary"><li><a href="/salud/254303-cómo-inducir-dolores-de-cabeza.html">Cómo inducir dolores de cabeza</a></li><li><a href="/comer-y-beber/251868-cómo-hacer-china-crujiente-de-algas-marinas.html">Cómo hacer china crujiente de algas marinas</a></li><li><a href="/jardín/132396-la-diferencia-entre-la-casa-arañas-y-brown.html">La diferencia entre la Casa Arañas y Brown Recoletos</a></li> </ul> </section> </aside> </div> <div class="footer-block col-md-3"> <aside class="sidebar sidebar-subsidiary2" role="complementary" id="sidebar-subsidiary2" itemscope="itemscope" itemtype="http://schema.org/WPSideBar"> <section id="nav_menu-3" class="widget widget_nav_menu"> <div class="widget-title font-headlines h3">Categoria</div> <div class="menu-more-themes-container"> <ul id="menu-more-themes" class="menu font-secondary"> <li><a href="/arte-y-entretenimiento/" rel="nofollow">Arte y entretenimiento</a></li><li><a href="/negocio/" rel="nofollow">Negocio</a></li><li><a href="/carreras-y-trabajo/" rel="nofollow">Carreras y Trabajo</a></li><li><a href="/carros/" rel="nofollow">Carros</a></li><li><a href="/artesanía/" rel="nofollow">Artesanía</a></li><li><a href="/las-pulseras-de-plumas-de-bricolaje/" rel="nofollow">Las pulseras de plumas de bricolaje</a></li><li><a href="/educación/" rel="nofollow">Educación</a></li><li><a href="/moda-estilo-y-cuidado-personal/" rel="nofollow">Moda, estilo y cuidado personal</a></li><li><a href="/comer-y-beber/" rel="nofollow">Comer y beber</a></li><li><a href="/jardín/" rel="nofollow">Jardín</a></li><li><a href="/salud/" rel="nofollow">Salud</a></li><li><a href="/aficiones-juegos-y-juguetes/" rel="nofollow">Aficiones, juegos y juguetes</a></li> </ul> </div> </section> </aside> </div> <div class="footer-block col-md-3"> <aside class="sidebar sidebar-subsidiary3" role="complementary" id="sidebar-subsidiary3" itemscope="itemscope" itemtype="http://schema.org/WPSideBar"> <section id="recent-posts-3" class="widget widget_recent_entries"> <div class="widget-title font-headlines h3">Categoria</div> <ul> <li><a href="/vacaciones-y-celebraciones/" rel="nofollow">Vacaciones y celebraciones</a></li><li><a href="/casa/" rel="nofollow">Casa</a></li><li><a href="/partes-entretenimiento/" rel="nofollow">Partes & Entretenimiento</a></li><li><a href="/finanzas-personales/" rel="nofollow">Finanzas personales</a></li><li><a href="/mascotas/" rel="nofollow">Mascotas</a></li><li><a href="/relaciones-y-familia/" rel="nofollow">Relaciones y Familia</a></li><li><a href="/deportes-y-estado-físico/" rel="nofollow">Deportes y estado físico</a></li><li class="active"><a href="/tech/" rel="nofollow">Tech</a></li><li><a href="/la-definición-de-aplicaciones-de-comercio-2/" rel="nofollow">La definición de aplicaciones de comercio electrón</a></li><li><a href="/viajar/" rel="nofollow">Viajar</a></li><li><a href="/bodas/" rel="nofollow">bodas</a></li><li><a href="/cultura-y-sociedad/" rel="nofollow">Cultura y Sociedad</a></li> </ul> </section> </aside> </div> <div class="footer-block col-md-3"> <aside class="sidebar sidebar-subsidiary4" role="complementary" id="sidebar-subsidiary4" itemscope="itemscope" itemtype="http://schema.org/WPSideBar"> <section id="nav_menu-4" class="widget widget_nav_menu"> <div class="widget-title font-headlines h3">Categoria</div> <ul> <li><a href="/otro/" rel="nofollow">Otro</a></li><li><a href="/electrónica/" rel="nofollow">Electrónica</a></li><li><a href="/víspera-de-todos-los-santos/" rel="nofollow">Víspera de Todos los Santos</a></li><li><a href="/crianza-de-los-hijos/" rel="nofollow">crianza de los hijos</a></li><li><a href="/responsabilidades-de-un-oficial-de-gestión-de-la/" rel="nofollow">Responsabilidades de un Oficial de Gestión de la I</a></li><li><a href="/puedo-obtener-copias-de-los-textos-enviados-a-otro/" rel="nofollow">¿Puedo obtener copias de los textos enviados a otr</a></li><li><a href="/diferencia-entre-la-radio-y-la-televisión/" rel="nofollow">Diferencia entre la radio y la televisión</a></li><li><a href="/cómo-tomar-una-captura-de-pantalla-en-el-iphone/" rel="nofollow">Cómo tomar una captura de pantalla en el iPhone</a></li><li><a href="/las-mejores-diseños-ventana-de-la-casa/" rel="nofollow">Las mejores diseños ventana de la casa</a></li><li><a href="/cómo-hacer-un-lazo-de-cuero-de-la-pluma-del-collar/" rel="nofollow">Cómo hacer un lazo de cuero de la pluma del collar</a></li><li><a href="/internet/" rel="nofollow">Internet</a></li> </ul> </section> </aside> </div> </div> </div> </div> <div class="container"> <div class="row"> <div class="footer-copyright col-md-6 col-sm-12 pull-left"> <p class="copyright"> Copyright @ 2021 howbored.ru <a href="/index.php?do=feedback" rel="nofollow">realimentacion</a></p> </div> </div> </div> </footer></div><link media="screen" href="/tema/howbored/style/styles.css" type="text/css" rel="stylesheet" /><script type="text/javascript">document.write("<a href='https://www.liveinternet.ru/click' target=_blank><img src='//counter.yadro.ru/hit?t43.6;r" + escape(document.referrer) + ((typeof(screen)=="undefined")?"":";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth?screen.colorDepth:screen.pixelDepth)) + ";u" + escape(document.URL) + ";" + Math.random() + "' border=0 width=0 height=0 alt='' title='LiveInternet'><\/a>")</script><script type="text/javascript">function addLink(){var body_element = document.getElementsByTagName('body')[0];var selection = document.getSelection();var pagelink = "<p>Fuente: <a href='"+document.location.href+"'>"+document.location.href+"</a></p>";var copytext = selection+pagelink;var newdiv = document.createElement('div');body_element.appendChild(newdiv);newdiv.innerHTML = copytext;selection.selectAllChildren(newdiv);window.setTimeout(function(){body_element.removeChild(newdiv)},0)}document.oncopy = addLink;</script><script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-4f7d7dc43c41fbaa"></script> <script id="dsq-count-scr" src="//howbored-ru.disqus.com/count.js" async></script></body></html>