استایل دادن به فرم های ورود اطلاعات

R

Rasivell

Member
سلام به تمام استادان مجدی انلاینی... :rose:

من میخوام یه کاری کنم که نیاز به کمک شما دوستان دارم ....

خوب، درخواست من اینه: من چند تا فرم برای ورود اطلاعات دارم مثلا فرم نظر دهی در انتهای هر مطلب در سایت .. حال میخوام بهشون با Css استایل بدم طوری که ماوس روشون رفت دارای Bordr بشن و به نوعی داینامیک و زنده نمایش داده بشن..
و یا وقتی ماوس روی این فیلد ها رفت یه تغیری بکنه... :cool:

برای نمونه سایت زیر رو نگاه کنید:

themedesign.ir

ببینم چی بهم یاد میدید که یه کاری کنم این فرم های من از حالت بی روح به حالت زنده تبدیل بشه..:)

قربان همگی..
 
echessdesign

echessdesign

مدیر انجمن طراحی وب
درود بر شما
کافیه که برای input های صفحه، یک class تعریف کنید و سپس برای آن hover در نظر بگیرید:
HTML: 
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled 1</title>
<style type="text/css">
input {
	background:red;
	border:1px dashed black;
}
input:hover {
	background:#ccc;
	border:1px solid red;
}
</style>
</head>

<body>
<form>
<input></input><br /><br />
<input></input><br /><br />
<input></input><br /><br />
<input></input>
</form>
</body>

</html>
توجه داشته باشید که رویداد hover برای عنصر input، در مرورگر IE6 پشتیبانی نمیشود!
 
bluekerm

bluekerm

Member
اینم کدهایی که دقیقا همون input های سایت themedesign.ir رو ایجاد میکنه:
کد: 
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled 1</title>
<style type="text/css">
INPUT{border:1px solid #ccc}
TEXTAREA,INPUT{padding:5px}
TEXTAREA:hover,INPUT:hover {border:1px solid #999}

</style>
</head>

<body>
<form>
<input></input><br /><br />
<input></input><br /><br />
<input></input><br /><br />
<input></input>
</form>
</body>

</html>
 
C

cjc1996

New Member
گردکردن حاشیه تکست باکس

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


<?php require_once('Connections/con1.php'); ?>
<?php
function GetSQLValueString($theValue, $theType, $theDefinedValue = "", $theNotDefinedValue = "")
{
$theValue = (!get_magic_quotes_gpc()) ? addslashes($theValue) : $theValue;


switch ($theType) {
case "text":
$theValue = ($theValue != "") ? "'" . $theValue . "'" : "NULL";
break;
case "long":
case "int":
$theValue = ($theValue != "") ? intval($theValue) : "NULL";
break;
case "double":
$theValue = ($theValue != "") ? "'" . doubleval($theValue) . "'" : "NULL";
break;
case "date":
$theValue = ($theValue != "") ? "'" . $theValue . "'" : "NULL";
break;
case "defined":
$theValue = ($theValue != "") ? $theDefinedValue : $theNotDefinedValue;
break;
}
return $theValue;
}


$editFormAction = $_SERVER['PHP_SELF'];
if (isset($_SERVER['QUERY_STRING'])) {
$editFormAction .= "?" . htmlentities($_SERVER['QUERY_STRING']);
}


if ((isset($_POST["MM_insert"])) && ($_POST["MM_insert"] == "form1")) {
$insertSQL = sprintf("INSERT INTO form1 (name, email, family, `select`, number) VALUES (%s, %s, %s, %s, %s)",
GetSQLValueString($_POST['name'], "text"),
GetSQLValueString($_POST['email'], "text"),
GetSQLValueString($_POST['family'], "text"),
GetSQLValueString($_POST['select'], "text"),
GetSQLValueString($_POST['mobile'], "int"));


mysql_select_db($database_con1, $con1);
$Result1 = mysql_query($insertSQL, $con1) or die(mysql_error());
}
?><!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>
<style>
<style type="text/css">
input {
background:red;
border:1px dashed black;
}
input:hover {
background:#ccc;
border:1px solid red;
}
</style>
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>


<body>
<form id="form1" name="form1" method="POST" action="<?php echo $editFormAction; ?>">
<p>
<input type="text" name="textfield" />
</p>
<p>
<input type="text" name="textfield2" />
</p>
<p>
<select name="select" size="1">
<option>number1</option>
<option>number2</option>
<option>number3</option>
</select>
</p>
<p>
<input type="text" name="textfield3" />
</p>
<p>
<input type="text" name="textfield4" />
</p>
<p>
<input type="submit" name="Submit" value="ثبت" />
</p>
</form>
</body>
</html>
اگه نشد این لینک رو دانلود کنید لینک
 
آخرین ویرایش:
برای ارسال پاسخ شما باید وارد سیستم شوید.

آخرین مطالب مجیدآنلاین

جدیدترین ارسال ها

بالا