استایل دهی به یک رشته بدون تگ

[alimir 795]

با سلام،

آیا امکانش هست به متنی که تگ مشخصی نداره بتونیم استایل دهی کنیم؟

مثلا در کد زیر بدون استفاده از سلکتور label، به رشته Username یک استایل اختصاصی بدیم؟

<label>Username<br>
<input type="text"  size="20">
</label>

[Parsa 23463]

اگر مشکل متغییر بودن نوشته هست

میتوانید با جکویری پیدا و استایل دهید

http://stackoverflow.com/questions/18534384/how-to-find-certain-text-with-jquery-and-style-them

[imanfakhar 26231]

همینطور می تونید رشته های اینجوری رو مستقیما در css بخونید یعنی به صورت after یا before لایه قبلی یا بعدیشون که البته لازمه فیلدتون هم تغییر کنه چون input از value مقدار می گیره

نمونه

http://jsfiddle.net/HCesJ/

[alimir 795]

ممنونم،

واقعیتش، این رو من برای فرم دهی به استایل پیشفرض وردپرس میخواستم! متأسفانه در فایل wp-login، متن ها به تنهایی داخل lable نیستند و نمیشه اختصاصی بهشون استایل داد. به همین خاطر میخواستم ببینم میشه بدون تغییر فایل wp-login این کار رو انجام داد یا نه!

با این احتساب، چون نسخه های زبانی مختلفی در وردپرس هست، فک نمیکنم روش نام گذاری و replace بتونه مؤثر باشه!!!

[imanfakhar 26231]

این ترکیب دیفالت فرم های بخش لاگ اینه

<form name="lostpasswordform" id="lostpasswordform" action="<?php echo esc_url( site_url( 'wp-login.php?action=lostpassword', 'login_post' ) ); ?>" method="post">
<p>
  <label for="user_login" ><?php _e('Username or E-mail:') ?><br />
  <input type="text" name="user_login" id="user_login" class="input" value="<?php echo esc_attr($user_login); ?>" size="20" /></label>
</p>
<?php
/**
  * Fires inside the lostpassword <form> tags, before the hidden fields.
  *
  * @since 2.1.0
  */
do_action( 'lostpassword_form' ); ?>
<input type="hidden" name="redirect_to" value="<?php echo esc_attr( $redirect_to ); ?>" />
<p class="submit"><input type="submit" name="wp-submit" id="wp-submit" class="button button-primary button-large" value="<?php esc_attr_e('Get New Password'); ?>" /></p>
</form>

تمام اجزا اولا زیر مجموعه خود فرمند

در ثانی در یک تگ p د در انتها در یک تگ label

اگر می خواهید به هر پاراگراف استایل جدا بدید از nth-child() استفاده کنید

p:nth-child(1) {color:red}
p:nth-child(4) {color:green}