Bienvenido a datoweb.com!! En este foro podrás encontrar ayuda sobre diseño y desarrollo web en general. Si quieres formar parte de esta comunidad para pedir ayuda o colaborar ayudando a otros usuarios del foro solo tienes que registrarte desde el siguiente enlace: Registrarse en el Foro

¿cómo cambiar el color del texto css?

Hola, estoy empezando a montar una web. Y querría saber como cambiar el color del texto "añadir producto" del siguiente código. ¿Alguien podría ayudarme?.
<div class="row">
<ul id="sellermenu" style="display:block;">
<li class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
<a title="Añadir producto" href="https://www.url.com">
<i class="icon-plus fa fa-plus"></i>
<span>Añadir producto</span>
</a>
</li>
<li class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
<a title="Productos" href="https://www.url.com">
<i class="icon-th-list fa fa-list"></i>
<span>Productos</span>
</a>


Gracias de antemano, un saludo.
Editado
0
Puntos
102
Visitas
6
Resp
Por Juan hace 2 semanas
Principiante
Respuesta #1
hola puedes probar hacerlo seleccionando el primer span usando :first-child, te dejo un ejemplo:
<style>
.row span:first-child { 
	font-weight: bold; 
	color: red;
}
</style>

<div class="row">
	<span>Añadir producto</span>

	<span>Productos</span>	
</div>
demo
1
Puntos
Por alber hace 2 semanas
Administrador
Respuesta #2
y esta es más precisa para tu código y no se suele ver mucho:
<style>
	.icon-plus + span {
		color: red;
	}
</style>

<div class="row">
	<ul id="sellermenu" style="display:block;">
		<li class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
			<a title="Añadir producto" href="https://www.url.com">
				<i class="icon-plus fa fa-plus"></i>
				<span>Añadir producto</span>
			</a>
			</li>
			<li class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
			<a title="Productos" href="https://www.url.com">
				<i class="icon-th-list fa fa-list"></i>
				<span>Productos</span>
			</a>
		</li>
	</ul>
</div>
demo

salu2 y bienvenido al foro!
0
Puntos
Por alber hace 2 semanas
Administrador
Respuesta #3
Gracias por la contestación. He probado a ponerlos, pero ninguno me funciona. Se me cambia el texto de fuera, no el de lo que necesito cambiar.

Te copio el código completo
{hook h='displayMarketplaceHeader'}

<div class="row seller_menu_container">
<div class="col-lg-12">
<a class="btn btn-secondary open_seller_menu" href="#">
<span> <i class="icon-list fa fa-list"
></i> {l s='Menu' mod='jmarketplace'} </span>
</a>
</div>
</div>

<div class="row">
<ul id="sellermenu"{if isset($tpl_name) AND $tpl_name == 'selleraccount'} style="display:block;"{/if}>
<li class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
<a title="{l s='Add product' mod='jmarketplace'}" href="{$link->getModuleLink('jmarketplace', 'addproduct', array(), true)|escape:'html':'UTF-8'}">
<i class="icon-plus fa fa-plus"></i>
<span> {l s='Add product' mod='jmarketplace'}</span>
</a>
</li>
<li class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
<a title="{l s='Products' mod='jmarketplace'}" href="{$link->getModuleLink('jmarketplace', 'sellerproducts', array(), true)|escape:'html':'UTF-8'}">
<i class="icon-th-list fa fa-list"></i>
<span>{l s='Products' mod='jmarketplace'}</span>
</a>
</li>
{if $show_import_product == 1}
<li class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
<a title="{l s='Import and export products' mod='jmarketplace'}" href="{$link->getModuleLink('jmarketplace', 'csvproducts', array(), true)|escape:'html':'UTF-8'}">
<i class="icon-arrow-up fa fa-arrow-up"></i>
<span>{l s='Import and export products' mod='jmarketplace'}</span>
</a>
</li>
{/if}
<li class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
<a title="{l s='View my seller profile' mod='jmarketplace'}" href="{$seller_link|escape:'html':'UTF-8'}">
<i class="icon-user fa fa-user"></i>
<span>{l s='Seller profile' mod='jmarketplace'}</span>
</a>
</li>
{if $show_edit_seller_account == 1 }
<li class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
<a title="{l s='Edit your seller account' mod='jmarketplace'}" href="{$link->getModuleLink('jmarketplace', 'editseller', array(), true)|escape:'html':'UTF-8'}">
<i class="icon-user fa fa-edit"></i>
<span>{l s='Edit seller account' mod='jmarketplace'}</span>
</a>
</li>
{/if}
{if $show_orders == 1}
<li class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
<a title="{l s='History commissions' mod='jmarketplace'}" href="{$link->getModuleLink('jmarketplace', 'sellerhistorycommissions', array(), true)|escape:'html':'UTF-8'}">
<i class="icon-list-ol fa fa-list"></i>
<span>{l s='History commissions' mod='jmarketplace'}</span>
</a>
</li>
{/if}
{if $show_manage_orders == 1}
<li class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
<a title="{l s='Manage Orders' mod='jmarketplace'}" href="{$link->getModuleLink('jmarketplace', 'orders', array(), true)|escape:'html':'UTF-8'}">
<i class="icon-money fa fa-money"></i>
<span>{l s='Orders' mod='jmarketplace'}</span>
</a>
</li>
{/if}
{if $show_manage_carriers == 1}
<li class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
<a title="{l s='Carriers and shipping cost' mod='jmarketplace'}" href="{$link->getModuleLink('jmarketplace', 'carriers', array(), true)|escape:'html':'UTF-8'}">
<i class="icon-truck fa fa-truck"></i>
<span>{l s='Carriers' mod='jmarketplace'}</span>
</a>
</li>
{/if}
<li class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
<a title="{l s='Payment' mod='jmarketplace'}" href="{$link->getModuleLink('jmarketplace', 'sellerpayment', array(), true)|escape:'html':'UTF-8'}">
<i class="icon-credit-card fa fa-credit-card"></i>
<span>{l s='Payment' mod='jmarketplace'}</span>
</a>
</li>
{if $show_contact == 1}
<li class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
<a title="{l s='Messages' mod='jmarketplace'}" href="{$link->getModuleLink('jmarketplace', 'sellermessages', array(), true)|escape:'html':'UTF-8'}">
<i class="icon-envelope fa fa-envelope-o"></i>
<span>{l s='Messages' mod='jmarketplace'} ({$mesages_not_readed|intval})</span>
</a>
</li>
{/if}
{if $show_dashboard == 1}
<li class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
<a title="{l s='Dashboard' mod='jmarketplace'}" href="{$link->getModuleLink('jmarketplace', 'dashboard', array(), true)|escape:'html':'UTF-8'}">
<i class="icon-tachometer fa fa-tachometer"></i>
<span>{l s='Dashboard' mod='jmarketplace'}</span>
</a>
</li>
{/if}
{if $show_seller_invoice == 1}
<li class="col-xs-6 col-sm-4 col-md-3 col-lg-2">
<a title="{l s='Withdraw money' mod='jmarketplace'}" href="{$link->getModuleLink('jmarketplace', 'sellerinvoice', array(), true)|escape:'html':'UTF-8'}">
<i class="icon-money fa fa-money"></i>
<span>{l s='Withdraw money' mod='jmarketplace'}<br/>(<strong>{$total_funds|escape:'html':'UTF-8'}</strong>)</span>
</a>
</li>
{/if}
{hook h='displayMarketplaceMenu'}
</ul>
</div>

{hook h='displayMarketplaceAfterMenu'}


Muchas gracias
0
Puntos
Por Juan hace 2 semanas
Principiante
Respuesta #4
buenas, este código no tengo manera de probarlo ya que parece prestashop o woocommerce etc, si quieres hacemos una cosa.. usa el segundo método que te pasé y haz una captura de la web en imagen para que vea lo que pasa.

me comentaste que se pone otro elemento de color rojo pero es raro por que ese código lo eh probado en bucle y veo esto:
css +

recuerda recargar la cache del navegador para hacer la prueba

salu2
0
Puntos
Por alber hace 2 semanas
Administrador
Respuesta #5
He conseguido cambiar el color muchas gracias. Añadí style="color: #d38219"; dentro del código <a>.
Gracias por las contestaciones.
0
Puntos
Por Juan hace 2 semanas
Principiante
Respuesta #6
de nada, claro de manera directa es muy sencillo agregarle un style="" pero el problema está en que si usas un CMS ecommerce cuando lo actualices ese ajuste se pierde por lo que los ficheros se reemplazan al hacer el update.

por eso estábamos haciendo mediante css ya que el ecommerce se actualiza pero el theme donde tienes el CSS no, pero bueno si de momento sales adelante de esa manera genial!

salu2!
0
Puntos
Por alber hace 2 semanas
Administrador
Compartir en facebook
Compartir en twitter
Compartir
Para comentar Inicia sesión o Registrate