espad

زیبا سازی فرم

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

سلام

دوستان من یه فرم ورود ساده دارم کسی میتونه کمکم کنه با استفاده از css یکم قشنگش کنم ؟

یا اینکه این فرم های آماده ای که هست رو چطوری می تونم با فرم خودم جایگزین کنم ؟

اینم کد فرم


<form id="form1" action="http://panel.payamakbartar.ir/MyLogin.aspx? ReturnUrl=%2f" method="post"><input id="__EVENTTARGET" type="hidden" name="__EVENTTARGET" value="" />
<input id="__EVENTARGUMENT" type="hidden" name="__EVENTARGUMENT" value="" />
<input id="__VIEWSTATE" type="hidden" name="__VIEWSTATE" value="/wEPDwUJMzc3MDA5NzMzD2QWBAIBD2QWCAIBDxYCHgRocmVmBRlUaG VtZXMvRGVmYXVsdC9BbGVydHMuY3NzZAICDxYCHwAFGlRoZW1lcy9EZWZhdWx 0L0ZhY2Vib3guY3NzZAIDDxYCHwAFGlRoZW1lcy9EZWZhdWx0L0Jsb2NrVUku Y3NzZAIEDxYCHwAFGFRoZW1lcy9EZWZhdWx0L0xvZ2luLmNzc2QCAw9kFhICB Q8WAh4HVmlzaWJsZWhkAgcPFgIfAWhkAgkPFgIfAWhkAgsPFgIfAWhkAg0PFg IfAWhkAg8PDxYCHghJbWFnZVVybAUffi9Mb2dvL2xvZ2luX25ldHBheWFtYWs uY29tLnBuZ2RkAhkPDxYCHgRUZXh0BThDb3B5cmlnaHQgJmNvcHk7IDIwMTIg TmV0UGF5YW1hayBDby4gQWxsIHJpZ2h0cyByZXNlcnZlZGRkAhsPDxYCHwMF/ Rc8c3BhbiBpZD0ibGJsQWJvdXQiPtmG2Kog2b7bjNin2YXaqSDYqNinINmH2K /ZgSDYp9ix2KfYptmHINiu2K/Zhdin2Kog2qnYp9mF2b7ZitmI2KrYsduMINm +2LHYr9in2LLYtCDYr9in2K/ZhyDYjCAg2LfYsdin2K3bjCDZiCDYqtmI2LPY udmHINmI2Kgg2Iwg2KfYt9mE2KfYuSDYsdiz2KfZhtuMINmIINin2YbYqtmC2 KfZhCDZgdmG2KLZiNix24wg2YbZiNuM2YYg2KfYsdiq2KjYp9i32KfYqiDYr9 mK2KrYpyDYqNmHICDaqdi02YjYsdiMINmH2YXYsdin2Ycg2KjYpyDYotmF2Yj Ysti0INqp2KfYr9ixINis2YjYp9mGINiu2YjYryDYqNix2KfbjCDYp9ix2KrZ gtin2KEg2K/Yp9mG2LQg2YHZhtuMINii2YbYp9mGINiv2LEg2LLZhdmK2YbZh yAg2LnZhNmI2YUg2KzYr9mK2K8g2KfYsdiq2KjYp9i32KfYqiDZiCDYrtiv2Y XYqiDYqNmHINi52YXZiNmFINmF2LHYr9mF2Iwg2LTYsdqp2KrZh9inINmIINi z2KfYstmF2KfZhiZzaHk7INmH2Kcg2KrZgNij2LPZitizICDar9ix2K/Zitiv LjxiciAvPg0K2YXYpyDYp9iz2KrZgdin2K/ZhyDYp9iyINqp2KfZhdm +2YrZiNiq2LEg2Ygg2KfZitmG2KrYsdmG2Kog2Ygg2LHYp9it2Komc2h5O9iq 2LEg2LTYr9mGINqp2KfYsSZzaHk72YfYpyDYqtmI2LPYtyDYotmGINix2Kcg2 K3ZgiDYqtmF2KfZhSAg2YXYsdiv2YUg2YXbjCZzaHk72K/Yp9mG2YrZhSDZhd inINiu2YTYp9mC2YrYqiDZiCDZhtmI2KLZiNix24wg2LHYpyDYs9ixINmE2Yj YrdmHJnNoeTvbjCDYqtmE2KfYtCZzaHk72YfYpyDZiCDZgdi52KfZhNmK2Kom c2h5O9mH2KfbjCDYrtmI2K8gINmC2LHYp9ixINiv2KfYr9mHJnNoeTvYp9mK2 YUg2Ygg2KjYsdin2YrZhiDYqNin2YjYsdmK2YUg2qnZhyDYsdmI2LLbjCDZhd uMJnNoeTvYsdiz2K8g2qnZhyDYqNix2KfbjCDYtNmH2LHZiNmG2K8g2qnYp9i x2KLZhdivICDYp9iz2KrZgdin2K/ZhyDYp9iyINqp2KfZhdm +24zZiNiq2LEg2Ygg2KfbjNmG2KrYsdmG2Kog2YfZhdin2YYgJnNoeTvZgtiv 2LEg2LbYsdmI2LHYqiDZhduMINmK2KfYqNivINqp2Ycg2KrZiNin2YbYp9mK2 4wg2K7ZiNin2YbYr9mGINmIICDZhtmI2LTYqtmG2Iwg2YjYqNix2KLZhtmK2Y Ug2KrYpyDYqNinINiq2K3ZgtmK2YIg2Ygg2b7Zitin2K/ZhyZzaHk72LPYp9i y24wg2LHYp9mHINit2YQmc2h5O9mH2KfbjCDYudmF2YTbjCDYqNix2KfbjCDY p9iz2KrZgdin2K/ZhyDYp9iyICDaqdin2YXZvtmK2YjYqtixINmIINin2YrZh tiq2LHZhtiqINiv2LEg2qnYp9ixJnNoeTvZh9in24wg2YXYrtiq2YTZgSDYqN mH2KrYsdmK2YYg2qnZitmB2YrYqiDYsdinINio2Ycg2YXYtNiq2LHZitin2YY g2K7ZiNivICDYp9ix2KfYptmHINmG2YXYp9mK2YrZhSDZiCDYp9mK2YYg2YXZ h9mFINiq2YbZh9inINio2Kcg2KrZiNis2YfYjCDZh9mF2YrYp9ix24zYjCDZh ti42LHYp9iqINmIINm +2YrYtNmG2YfYp9iv2KfYqiDYtNmF2KcgINqp2KfYsdio2LHYp9mGINi52LLZ itiyINmF2YrYs9ix2K7ZiNin2YfYryDYtNivIC48YnIgLz4NCtmF2Kcg2KfYs iDZh9ix2q/ZiNmG2Ycg2YfYstmK2YbZhyDYstin2KbYryDYp9is2KrZhtin2K gg2YXbjCZzaHk72qnZhtmK2YXYjCDZh9mF2obZhtmK2YYg2YXYpyDYudmC2Yr Yr9mHINiv2KfYsdmK2YUg2YXYtNiq2LHbjCAg2YbYqNin2YrYryDYqNmH2Kfb jCDYtti52YEmc2h5O9mH2KfbjCDZhdiv2YrYsdmK2KrbjCDZiCDZitinINin2 LTaqdin2YTYp9iqINin2KzYsdin2YrbjCDaqdin2LEg2YXYpyDYsdinINio2b 7Ysdiv2KfYstivLiDZvtizINmF2KcgINm +2YrYtCDYp9iyINix2KfZhyZzaHk72KfZhtiv2KfYstuMINmH2LEg2LPYsdmI 2YrYsyDYrNiv2YrYr9iMINio2Ycg2K/ZgtiqINii2YYg2LHYpyDZhdmI2LHYr yDZhdi32KfZhNi52Ycg2YLYsdin2LEg2K/Yp9iv2Ycg2YggINmC2KfYqNmE2Y rYqiDYp9is2LHYp9mK24wg2KLZhiDYsdinINio2LHYsdiz24wg2YXbjCDaqdm G2YrZhS4g2YfZhdqG2YbZitmGINmF2Kcg2KjYsdin2YrZhiDYudmC2YrYr9mH INmH2LPYqtmK2YUg2qnZhyDYqNmHINiv2LPYqiAg2KLZiNix2K/ZhiDYs9mI2 K8g2qnZhdiq2LEg2KfYsiDZitqpINmF2LTYqtix24wg2K/YsSDYtdmI2LHYqt mK2qnZhyDYqNmHINmG2K3ZiNuMINin2YbYrNin2YUg2q/Ysdiv2K8g2qnZhyD Zhdi02KrYsduMINin2LIgINiu2K/Zhdin2Kog2KfYsdin2KbZhyDYtNiv2Ycg 2LHYttin2YrYqiDYr9in2LTYqtmHINio2KfYtNiv2Iwg2KLZhiDZhdi02KrYs duMINix2Kcg2KjZhyDZitqpINmC2YjZhyDYqtio2YTZiti624wg2K7ZiNiv2L PYp9iu2KrZhyAg2YXYqNiv2YQg2qnZhtiv2Iwg2Ygg2KfZitmGINin2YHYsti n2YrYtCDYs9mI2K8g2YXYpyDYsdinINio2Ycg2LnZhtmI2KfZhiDYp9ix2KfY ptmHINiv2YfZhtiv2Ycg2K7Yr9mF2KfYqiDYr9ixINio2LHYrtmI2KfZh9ivI CDYr9in2LTYqi4g2KfZitmGINin2LXZiNmEINiz2KfYr9mHINiMINiv2LEg2L nZhdmEINmC2KfYqNmEINio2qnYp9ix2q/Zitix24wg2YfYs9iq2YbYryDZiCD Zvtin2YrZhyDYqtmF2KfZhduMINmB2LnYp9mE2YrYqiZzaHk72YfYp9uMICDZ hdinINix2Kcg2KrYtNqp2YrZhCDZhduMJnNoeTvYr9mH2YbYry48YnIgLz4NC tmF2Kcg2KjYpyDYrdiz2YYg2YbZitiqINqp2KfZhdmEINin2LXZiNmEINiz2K fYr9mHINi02q/ZgdiqJnNoeTvYp9mG2q/ZitiyINqp2KfYsdmF2KfZhiDYsdi nINmF2YbYqti02LEg2YXbjCZzaHk72qnZhtmK2YUg2obZiNmGICDYudmC2YrY r9mHINiv2KfYsdmK2YUg2qnZhyDYr9ixINmK2qkg2YHYttin24wg2LHZgtin2 KjYqtuMINiz2KfZhNmF2Iwg2KzYp9uMINqp2KfZgduMINio2LHYp9uMINmF2K cg2Ygg2KrZhdin2YUg2YfZhdqp2KfYsdin2YYgINiv2Yrar9ix2YXYp9mGINm I2KzZiNivINiu2YjYp9mH2K8g2K/Yp9i02KrYjCDZiCDYp9mK2YYg2YHYttin INiv2LEg2YbZh9in2YrYqiDZh9mFINio2Ycg2YbZgdi5INmF2Kcg2IzZh9mFI Nio2Ycg2YbZgdi5INmF2LHYr9mFICDYqNmHINi52YbZiNin2YYg2YXYtNiq2L HZitin2YYg2KLZitmG2K/ZhyDZhdinINmIINmH2YXaqdin2LHYp9mGINmF2Kc g2K7ZiNin2YfYryDYqNmI2K8gLjwvc3Bhbj5kZAIdDw8WAh8DBY0B2KrZhNmB 2YY6IDY2OTY4Mzk4LTY2NDgzODY0IDxiciAvPg0K2KfbjNmF24zZhDogY29ud GFjdEBuZXRwYXlhbWFrLmNvbTxiciAvPg0K2K/Zgdiq2LEg2YXYsdqp2LLbjD og2KrZh9ix2KfZhi3YrtuM2KfYqNin2YYg2YHZhNiz2LfbjNmGPGJyIC8+ZGQ YAQUeX19Db250cm9sc1JlcXVpcmVQb3N0QmFja0tleV9fFgEFCGJ0bkxvZ2lu uzdLsodXh5TJktqjcjPZ9RnP8tQ=" />
<script type="text/javascript">// <![CDATA[
var theForm = document.forms['form1']; if (!theForm) { theForm = document.form1; } function __doPostBack(eventTarget, eventArgument) { if (!theForm.onsubmit || (theForm.onsubmit() != false)) { theForm.__EVENTTARGET.value = eventTarget; theForm.__EVENTARGUMENT.value = eventArgument; theForm.submit(); } }
// ]]></script>
نام کاربری:<input id="txtUID" class="text" type="text" name="txtUID" /> رمز عبور: <input id="txtPwd" class="text" type="password" name="txtPwd" /> <a id="btnLogin" tabindex="3" href="javascript:__doPostBack('btnLogin','')">ورود به پنل </a></form> 
 
 

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


لینک به پست

سلام

به انجمن خوش اومدین دوست عزیز

یا اینکه این فرم های آماده ای که هست رو چطوری می تونم با فرم خودم جایگزین کنم ؟

یک نمونه آدرس بدید تا بهتون توضیح بدیم

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


لینک به پست

کل فایل شما 30 کیلوبایت بود که بیخود اون رو 2.5 مگ کردن!

پیوست رو بررسی کنید.

اگر دکمه ورود مشکل داشت باید دوباره بصورت لینک قرار بدید.

CSS_LOGIN.rar

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


لینک به پست

آقا مرتضی متشکرم از زحمتی که کشیدی ولی من نتونستم از فایل ها استفاده کنم.

چطوری می تونم لینک "ورود به پنل " رو در کد زیر تبدیل به دکمه بکنم ؟

اینم کد


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>فرم ورود</title>
</head>
<body>
<form id="form1" method="post" action="http://panel.payamakbartar.ir/MyLogin.aspx?ReturnUrl=%2f"
style="direction: rtl; font-family: Tahoma; font-size: 14px">
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUJMzc3MDA5NzMzD2QWBAIBD2QWCAIBDxYCHgRocmVmBRlUaGVtZXMvRGVmYXVsdC9BbGVydHMuY3NzZAICDxYCHwAFGlRoZW1lcy9EZWZhdWx0L0ZhY2Vib3guY3NzZAIDDxYCHwAFGlRoZW1lcy9EZWZhdWx0L0Jsb2NrVUkuY3NzZAIEDxYCHwAFGFRoZW1lcy9EZWZhdWx0L0xvZ2luLmNzc2QCAw9kFhQCAQ8WAh4HVmlzaWJsZWhkAgMPFgIfAWhkAgUPFgIfAWhkAgcPFgIfAWhkAgkPFgIfAWhkAgsPFgIfAWhkAg0PFgIfAWhkAg8PDxYCHghJbWFnZVVybAUHfi9Mb2dvL2RkAhcPFgIfAWhkAhkPDxYCHgRUZXh0BQY8YnIgLz5kZBgBBR5fX0NvbnRyb2xzUmVxdWlyZVBvc3RCYWNrS2V5X18WAQUIYnRuTG9naW4jkujA5P2WMKHMYBGgIQSXr6Sr1A==" />
<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['form1'];
if (!theForm) {
theForm = document.form1;
}
function __doPostBack(eventTarget, eventArgument) {
if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
theForm.__EVENTTARGET.value = eventTarget;
theForm.__EVENTARGUMENT.value = eventArgument;
theForm.submit();
}
}
//]]>
</script>
<table dir="rtl">
<tr>
<td>
نام کاربری :
</td>
<td>
<input type="text" id="txtUID" name="txtUID" />
</td>
</tr>
<tr>
<td>
گذرواژه :
</td>
<td>
<input type="password" id="txtPwd" name="txtPwd" />
</td>
</tr>
</table>
<br />
<a id="btnLogin" tabindex="3" href="javascript:__doPostBack('btnLogin','')">ورود به
پنل </a>
</form>
</body>
</html>

مرسی

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


لینک به پست

برای مثال :

<a href="javascript:__doPostBack('btnLogin','')" class="buttdl1">ورود به پنل</a>

و این کدهارو هم به style.css اضافه کنید :

.buttdl1{
background-color:#FF3300;
background-image:-webkit-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,0.1));
background-image:-moz-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,0.1));
background-image:-ms-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,0.1));
background-image:-o-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,0.1));
background-image:linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,0.1));
display:inline-block;
vertical-align:middle;
color:#f6f6f6 !important;
font-size:11px;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4);
font-weight: lighter;
padding: 8px 12px 8px 11px;
text-align:center;
text-decoration:none;
text-shadow:0px 1px 0px rgba(0,0,0,0.1);
-webkit-box-shadow:inset 0px -3px 0px rgba(0,0,0,0.1), 0px 3px 0px rgba(0,0,0,0.1);
-moz-box-shadow:inset 0px -3px 0px rgba(0,0,0,0.1), 0px 3px 0px rgba(0,0,0,0.1);
box-shadow:inset 0px -3px 0px rgba(0,0,0,0.1), 0px 3px 0px rgba(0,0,0,0.1);
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
float: left;
}
.buttdl1:hover{
background-image:-webkit-linear-gradient(top, rgba(0,0,0,0.05), rgba(0,0,0,0.2));
background-image:-moz-linear-gradient(top, rgba(0,0,0,0.05), rgba(0,0,0,0.2));
background-image:-ms-linear-gradient(top, rgba(0,0,0,0.05), rgba(0,0,0,0.2));
background-image:-o-linear-gradient(top, rgba(0,0,0,0.05), rgba(0,0,0,0.2));
background-image:linear-gradient(top, rgba(0,0,0,0.05), rgba(0,0,0,0.2));
}

.buttdl1:active{
position:relative;
top:2px;
-webkit-box-shadow:inset 0px -1px 0px rgba(0,0,0,0.1), 0px 2px 0px rgba(0,0,0,0.1);
-moz-box-shadow:inset 0px -1px 0px rgba(0,0,0,0.1), 0px 2px 0px rgba(0,0,0,0.1);
box-shadow:inset 0px -1px 0px rgba(0,0,0,0.1), 0px 2px 0px rgba(0,0,0,0.1);
}

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

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


لینک به پست

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

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

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

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


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

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

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


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

  • مطالب مشابه

    • توسط saeid1872
      سلام دوستان
      تو کمتر از یک ماه سایتم 61 ارور 500 ثبت کرده که در حال زیاد شدن هستش نمیدونم چرا این ارورهارو ثبت میکنه
      لطفا دلیلش رو بگید و اینکه چطور باید رفع کنم
      من خیلی اصلا حرفه ای نیستم فقط خواهشا جوری راهنمایی کنید که بتونم رفعش کنم.

    • توسط Zahramz
      سلام خدمت اساتید محترم
      میخوام یه فرم ثبت نام با امکان اتچ کردن فایل به سایتم اضافه کنم. (کاربر یک سری فیلد رو پر کنه و تعدادی فایل رو اتچ کنه، و در نهایت درخواستش رو ارسال کنه برای مدیر سایت که بررسی بشه.)
      اگه افزونه ای یا راهی بهم معرفی کنید ممنون میشم.
    • توسط devil1367
      با سلام
      من یک فروشگاه دارم چون قالب قبلیم نیازهامو نمیتونست برطرف کنه یه قالب جدید از یکی از سایتها خریداری کردم
      سوالم اینه با نصب بسته اسان نصب اطلاعاتی یا محصولات قبلی که داشتم حذف میشن ؟
      چطوری قالب رو شبیه دمو دربیارم و صفحات و برگه ها import کنم.
       
      با تشکر
    • توسط armakcell
      با سلام بنده در سایتم میخواستم یک ابزارک قرار بدم مانند ابزارک این سایت
      http://powerturk.ir

      اگر داخل این سایت برید در یک قسمت نوشته است آرشیو فول البوم
      بنده این ابزارک را چگونه به دست بیارم؟
      بنده یک تصویر ضمیمه میکنم در صورتی که در سایت وارد نشد

    • توسط amir_hossein
      سلام دوستان من قصد دارم چندتا اسلاید کناره هم به صورت خطی (مثلا 4 تا اسلاید) اواسط صفحه اصلی یا انتهای صفحه قرار بدم.افزونه ای میتونید بهم معرفی کنید برای اینکار؟