logo

Atributo de color de fuente HTML

Atributo de color de fuente HTML especifica el color del texto del contenido dentro del etiqueta . El atributo de color de fuente acepta un valor de color que queremos aplicar a un texto y se mostrará en pantalla con ese color mencionado.

Sintaxis:

>

Valores de atributos:



  • nombre_color: Establece el color del texto utilizando el nombre del color. Por ejemplo: rojo .
  • número_hexadecimal: Establece el color del texto mediante el uso de un código hexadecimal de color. Por ejemplo: #0000ff .
  • número_rgb: Establece el color del texto mediante el uso de código rgb. Por ejemplo: rgb(0, 153, 0) .

Nota: El atributo de color no es compatible con HTML5 .

Ejemplo para establecer el color de fuente en HTML

Podemos usar el atributo de color del etiqueta de fuente para establecer un color de fuente en HTML. Podemos asignar un valor de color usando un nombre del color , código hexadecimal , o código RGB .

Entendámoslo mejor con el ejemplo:

Ejemplo: En este ejemplo, obtenemos el texto coloreado utilizando el atributo de color que tiene tres tipos diferentes de valores. Hemos utilizado el valor del nombre del color, el valor del código hexadecimal y el valor del código RGB para establecer el color de fuente de tres elementos de texto diferentes.

HTML
   HTML |<font>color Título del atributo> cabeza> <body> <font size='6' face='verdana' color='green'>techcodeview.com! fuente> <br> <font size='6' face='arial' color='#008000'>techcodeview.com! fuente> <br> <font size='6' color='rgb(128, 128, 0)'>techcodeview.com! fuente> cuerpo> html>></pre> </code> <p dir='ltr'>  <b>  <strong>Producción:</strong>  </b>  </p> <p dir='ltr'> <img src='//techcodeview.com/img/html-attributes/40/html-font-color-attribute.webp' alt="color de fuente html usando el atributo de color"></p> <h3>  <b>  <strong>Navegadores compatibles</strong>  </b>  </h3><p dir='ltr'><span>Puede ver los colores de fuente HTML establecidos utilizando estos navegadores. Los navegadores admiten el atributo de color de la etiqueta de fuente y muestran los cambios en el color del texto.</span></p> <ul><li value='1'> <span>Google Chrome</span> </li><li value='2'> <span>Borde</span> <span> </span> </li><li value='3'> <span>Firefox</span> </li><li value='4'> <span>Ópera</span> </li><li value='5'> <span>Safari</span> </li></ul><p dir='ltr'><span>HTML es la base de las páginas web y se utiliza para el desarrollo de páginas web mediante la estructuración de sitios web y aplicaciones web. Puede aprender HTML desde cero siguiendo esto</span> <span>Tutorial HTML</span> <span>y</span> <span>Ejemplos HTML</span> <span>.</span></p>  <br></article><div class="rekl_placeholder"><script type="text/javascript">atOptions = {'key' : 'f2b09f3e7178b263531e10998e9a32fa','format' : 'iframe','height' : 250,'width' : 300,'params' : {}};</script><script type="text/javascript" src="//spiritscaution.com/f2b09f3e7178b263531e10998e9a32fa/invoke.js"></script></div> </article>
                         
                        </div><!--//content-->
                    </div><!--//section-inner-->                 
                </section><!--//section-->
    
            </div><!--//primary-->
            <div class="secondary col-md-4 col-sm-12 col-xs-12">
                  <aside class="info aside section">
                    <div class="section-inner">
                        <h2 class="">Categoría</h2>
                        <div class="content">
                            <ul class="list-unstyled">
                                <li> <a href="/bootstrap-tutorial/">Tutorial De Arranque</a> </li><li> <a href="/net-framework/">.Net Framework</a> </li><li> <a href="/vb-net-tutorial/">Tutorial De Vb.net</a> </li><li> <a href="/bootstrap-5-cat/">Arranque 5</a> </li><li> <a href="/cpp-map-functions/">Funciones-Mapa-Cpp</a> </li><li> <a href="/dip-tutorial/">Tutorial De Inmersión</a> </li><li> <a href="/python-sorting-exercises/">Ejercicios-De-Clasificación De Python</a> </li><li> <a href="/java-inner-class/">Clase Interna De Java</a> </li><li> <a href="/shortcut-keys/">Teclas De Atajo</a> </li><li> <a href="/ejb-tutorial/">Tutorial Ejb</a> </li>
                                
                            </ul>
                        </div><!--//content-->  
                    </div><!--//section-inner-->                 
                </aside><!--//aside-->
                
                 <aside class="testimonials aside section">
                	 <div class="section-inner">
                        <div class="content">
                            <div class="item">
  								<div class="rekl_placeholder" id="sidebar_placeholder_1"> <script type="text/javascript">atOptions = {'key' : 'f53f1abf3c3a788f849c12a956865db1','format' : 'iframe','height' : 300,'width' : 160,'params' : {}};</script><script type="text/javascript" src="//spiritscaution.com/f53f1abf3c3a788f849c12a956865db1/invoke.js"></script> <br></div>                                                   
                            </div>
                        </div>
                    </div>
                   <div class="section-inner">
                        <h2 class="heading">GBM en el aprendizaje automático</h2>
                        <div class="content">
                            <div class="item">
                                 <blockquote class="quote">                                  
                                    <span> <i class="fa fa-quote-left"></i> GBM en aprendizaje automático con tutorial, introducción al aprendizaje automático, qué es el aprendizaje automático, aprendizaje automático de datos, aprendizaje automático frente a inteligencia artificial, etc.</span>
                                </blockquote>                
                                                                                             
                            </div><!--//item-->
                            
                            <p> <a class="more-link" href="/gbm-machine-learning"> <i class="fa fa-external-link"></i> Leer Más</a> </p> 
                            
                        </div><!--//content-->
                    </div><!--//section-inner-->
                </aside><!--//section-->
                
               
                            
                 <aside class="languages aside section">
                    <div class="section-inner">
                        <h2 class="heading">Artículos De Interés</h2>
                        <div class="content">
                            <ul class="list-unstyled">
                                <li class="item">
                                    <span class="title"> <strong> <a href="/data-abstraction-and-data-independence">Abstracción de datos e independencia de datos</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/top-50-java-project-ideas">Las 50 mejores ideas de proyectos Java para principiantes y avanzados</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/java-double/">Java-Doble</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/what-is-application-software">¿Qué es el software de aplicación?</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/complete-list-colleges-with-no-application-fee-131698">Lista completa: universidades sin tarifa de solicitud (actualizada)</a> </strong> </span>
                                    
                                </li><!--//item-->
                               
                            </ul>
                        </div><!--//content-->
                    </div><!--//section-inner-->
                </aside><!--//section-->
                
              
                 <aside class="list music aside section">
                    <div class="section-inner">
                        <h2 class="heading">Entradas Populares</h2>
                        <div class="content">
                            <ul class="list"> <li><a href="/javafx-tutorial">tutorial jfx java</a>
</li><li><a href="/modulus-operator-c-c">¿Qué es el módulo en C++?</a>
</li><li><a href="/what-is-microsoft-azure-subscription">suscripción azul</a>
</li><li><a href="/how-find-out-my-monitor-size">¿Cuál es el tamaño de la pantalla de mi monitor?</a>
</li><li><a href="/java-convert-char-int">carácter a int</a>
</li><li><a href="/java-arrays">matriz.de java</a>
</li> 
                                
                                
                            </ul>
                        </div><!--//content-->
                    </div><!--//section-inner-->
                </aside><!--//section-->
              
            </div><!--//secondary-->    
        </div><!--//row-->
    </div><!--//masonry-->
    
	    <footer class="footer">
        <div class="container text-center">
                <span>
Copyright ©2025 Todos Los Derechos Reservados |  <a href="//sv.techcodeview.com/">techcodeview.com</a> | <a href="/disclaimer" rel="nofollow noopener noreferrer" target="_blank">Descargo De Responsabilidad</a>  |  <a href="/about-us" rel="nofollow noopener noreferrer" target="_blank">Acerca De Nosotros</a>  |  <a href="/privacy-policy" rel="nofollow noopener noreferrer" target="_blank">Política De Privacidad</a>  </span>
        </div>
    </footer>
 
         
    <script type="text/javascript" src="https://techcodeview.com/template/assets/plugins/jquery-1.11.3.min.js"></script>
    <script type="text/javascript" src="https://techcodeview.com/template/assets/plugins/bootstrap/js/bootstrap.min.js"></script>    
    

    <script type="text/javascript" src="https://techcodeview.com/template/assets/js/main.js"></script>     
	
	<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.1/highlight.min.js"></script>
	
</body>
</html>