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="/dbms-relational-algebra/">Dbms-Álgebra Relacional</a> </li><li> <a href="/instagram/">Instagram</a> </li><li> <a href="/dynamic-programming/">Programación dinámica</a> </li><li> <a href="/chatgpt/">Chatgpt</a> </li><li> <a href="/android-tips-tricks/">Trucos De Consejos De Android</a> </li><li> <a href="/gta-5-cat/">Gta 5</a> </li><li> <a href="/animal-physiology/">Fisiología Animal</a> </li><li> <a href="/coding-problems/">Problemas De Codificación</a> </li><li> <a href="/c-static-keyword/">C++-Palabra Clave Estática</a> </li><li> <a href="/cpp-constructor/">Constructor-Cpp</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">Árbol indexado binario o árbol de Fenwick</h2>
                        <div class="content">
                            <div class="item">
                                 <blockquote class="quote">                                  
                                    <span> <i class="fa fa-quote-left"></i> Un portal de informática para geeks. Contiene artículos de programación y ciencias de la computación bien escritos, bien pensados ​​y bien explicados, cuestionarios y preguntas de práctica/programación competitiva/entrevistas de empresa.</span>
                                </blockquote>                
                                                                                             
                            </div><!--//item-->
                            
                            <p> <a class="more-link" href="/binary-indexed-tree"> <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="/html">HTML</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/bob-ross">bob ross</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/sat-how-many-people-get-1400-1311216">En el SAT, ¿cuántas personas obtienen un 1400, 1500 o 1600?</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/an-inch-is-2-5-cm-that-means-180-cm-is-72-inches">Una pulgada son 2,5 cm. Eso significa que 180 cm son 72 pulgadas. Si 72 pulgadas son 6 pies, ¿por qué 180 cm son 5 pies 11?</a> </strong> </span>
                                    
                                </li><!--//item--><li class="item">
                                    <span class="title"> <strong> <a href="/how-search-words-word-document">Cómo buscar palabras en un documento de Word</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="/read-eval-print-loop-java">responder en java</a>
</li><li><a href="/generics-java">genericidad en java</a>
</li><li><a href="/java-stack">pila java</a>
</li><li><a href="/infinite-loop-c">Bucle infinito</a>
</li><li><a href="/sql-cast-function">emitir en sql</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="//ro.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>