reazah

راست چین کرد عناصر فرم تماس با ما

12 پست در این موضوع قرار دارد

سلام وقتتون بخیر وشادی

چطور می تونم عناصر فرم مثل این سایت با سی اس اس راست چین کنم با فلوآت که نتونستم با inpest element هم کدهاش و دیدم و هرچی امتحان کردم نشد

http://livedemo00.template-help.com/wt_45486/index-4.html

به اشتراک گذاری این پست


لینک به پست

با firebug چک کن حتما به نتیجه می رسی. مثلا برای تکست باکس ها input هست. ناحیه متن textarea. نوشته ها label هست. به راحتی می تونی استایل بدی. اگه مشکلی بود آنلاینش کن چک کنیم.

به اشتراک گذاری این پست


لینک به پست

<div id="form">

<div class="moduletable">
<h3>

فرم تماس

</h3>
<script type="text/javascript">


window.addEvent('domready',function(){
var sp_sc118 = new sp_sc('sp_qc_submit', {
name: document.id('name'),
modId: 118,
email: document.id('email'),
subject: document.id('subject'),
message: document.id('message'),
status: document.id("sp_qc_status"),
name_text: "نام و نام خانوادگي ...",
email_text: "آدرس ايميل ...",
msg_text: "متن پيام ...",
err_msg: "تمام گزينه هاي مشخص شده لازم و ضروري هستند.",
email_warn: "لطفاً آدرس ايميل معتبري وارد کنيد.",
wait_text: "لطفاً صبر کنيد",
failed_text: "ايميل ارسال نشد !",
ajax_url: "http://localhost/-/modules/mod_sp_quickcontact/helper.php"
});
});

</script>
<div id="sp_quickcontact118" class="sp_quickcontact">
<div id="sp_qc_status"></div>
<div class="sp_qc_clr"></div>
<input id="name" type="text" value="نام و نام خانوادگي ..." onblur="if (this.value=='') this.value='نام و نام خانوادگي ...';" onfocus="if (this.value=='نام و نام خانوادگي ...') this.value='';" name="name" style="background: none repeat scroll 0% 0% rgb(242, 242, 242);"></input>
<div class="sp_qc_clr"></div>
<input id="email" type="text" value="آدرس ايميل ..." onblur="if (this.value=='') this.value='آدرس ايميل ...';" onfocus="if (this.value=='آدرس ايميل ...') this.value='';" name="email"></input>
<div class="sp_qc_clr"></div>
<input id="subject" type="text" value="موضوع پيام ..." onblur="if (this.value=='') this.value='موضوع پيام ...';" onfocus="if (this.value=='موضوع پيام ...') this.value='';" name="subject"></input>
<div class="sp_qc_clr"></div>
<textarea id="message" rows="" cols="" onblur="if (this.value=='') this.value='متن پيام ...';" onfocus="if (this.value=='متن پيام ...') this.value='';" name="message">

متن پيام ...

</textarea>
<div class="sp_qc_clr"></div>
<input id="sp_qc_submit" class="button" type="submit" value="ارسال"></input>


#form input, textarea {
background: none repeat scroll 0% 0% rgb(242, 242, 242);
float: right;
}

#form
{
margin: 40px 0 75px 0;
background: red;

}
#form input,textarea
{
background:#F2F2F2;
float: right;

}
#name,#email,#subject
{
height: 42px;
}

ویرایش شده در توسط reazah

به اشتراک گذاری این پست


لینک به پست


#form input, textarea{background: none repeat scroll 0% 0% rgb(242, 242, 242);}
#form{
float:right;
margin:20px auto;
background:red;
}
#form input,textarea{
background:#F2F2F2;
float: right;
}
#name,#email,#subject{height: 42px;}

float رو به آیدی form باید میدادی.

به اشتراک گذاری این پست


لینک به پست

نه درست نمیشه ایدی form که برای کل قسمت فرم تماس با ما است

مشکل من این سه تاست

#name,#email,#subject

{

background:#F2F2F2;

height:42px;

float: right;

}

که نمی تونم تو یک خط نمایش بدم

ویرایش شده در توسط reazah

به اشتراک گذاری این پست


لینک به پست


#form input, textarea{background: none repeat scroll 0% 0% rgb(242, 242, 242);}
#form h3{
text-align:right;
}
#form{
width:600px;
height:auto;
float:right;
margin:20px auto;
background:red;
}
#form input{
background:#F2F2F2;
float: right;
text-align:right;
direction:rtl;
}
#form textarea{
width:500px;
height:300px;
float:right;
margin-top:10px;
text-align:right;
direction:rtl;
}
#name,#email,#subject{height: 42px;}

الان تو یه خط هستند :)

به اشتراک گذاری این پست


لینک به پست

ممنون نشد

شما تست می کنید ؟

به اشتراک گذاری این پست


لینک به پست

ممنون نشد

شما تست می کنید ؟

من تست کردم. درست بود همه چیز.

به اشتراک گذاری این پست


لینک به پست

هرجایی که دیدید کدتون اعمال نشد حتما تو صفحه یه جایی نغض شده با کد !important می تونید تاکید کنید رو کدتون مثل


text-align:right !important;

و این که لطفا بعد هر تغییر Ctrl +f5 بزنید شاید اعمال شده مرورگر از کش استفاده می کنه

به اشتراک گذاری این پست


لینک به پست

هرجایی که دیدید کدتون اعمال نشد حتما تو صفحه یه جایی نغض شده با کد !important می تونید تاکید کنید رو کدتون مثل


text-align:right !important;

و این که لطفا بعد هر تغییر Ctrl +f5 بزنید شاید اعمال شده مرورگر از کش استفاده می کنه

آقا مهدی یه سوال

کد چجوری می تونه نغض بشه؟ توسط مرورگر نغض میشه یا یه کد دیگه؟ میشه یه کم در موردش برام توضیح بدین.

به اشتراک گذاری این پست


لینک به پست

آقا مهدی یه سوال

کد چجوری می تونه نغض بشه؟ توسط مرورگر نغض میشه یا یه کد دیگه؟ میشه یه کم در موردش برام توضیح بدین.

کدهای css آبشاری هستند یعنی اولویت با کدی است که در موقع فراخوانی زیر کد قبلی جای بگیرد و دستور !important باعث می شود سند به اولویت ها نگاه نکند و بر اساس خاصیت !important شده چیده شود

به اشتراک گذاری این پست


لینک به پست

یه نمونه خیلی ساده که میتونم مثال بزنم این که شما از این کد استفاده کنید که میشه گفت استاندار هم نیست ولی برای مثال خوبه


margin-right:15px;
margin:auto;

تو خروجی کد margin-right مقدار auto میگیره و شما یا باید بیاریدش بعد margin:auto یا یه !important بزارید ولی مثالم خیلی ساده هست

معمولا در اینپوت ها این مشکل هست که از سلکتور input[type=text] استفاده میشه و یه سری مقدار داده میشه بعدا شما میاید و با یه سلکتور یک input[type=text] را صدا می زنید ولی کد های اینپوت اول اولویت داره تا کد هایی که شما گذاشتید برای همین از !important استفاده می کنیم

امیدوارم متوجه شده باشید

به اشتراک گذاری این پست


لینک به پست

برای ارسال نظر یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

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

ایجاد یک حساب کاربری

برای حساب کاربری جدید در انجمن ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید


ورود به حساب کاربری