نظرتون در مورد این طراحی

[dreadful]

سلام دوستان

www.gimo.ir


من اینو طراحی کردم ،به نظرتون کجاهاش مشکل طراحی داره ؟

من اندازه Width اصلی رو گرفتم 1000 تا ،مشکل نداره ؟

اگه لبتاب یا تبلت بود که width اون از این کمتر بود خراب نمیشه ؟! نباید metatag viewport توش به کار ببرم که درست بشه ؟!؟!

توی موبایل که تست کردم اون هدر بالاش کوچیک میشه و 100% صفحه رو نمیگیره ،چی کارش باید بکنم ؟

[ateryad]

طراحی ظاهری خوبی داره.
تبریک میگم بهت دوست عزیز

[دانیال دزفولی]

سلام صادق ،
برای هدر این کارو کن حله
Min-width:980px

980 مثاله میتونه هرچی دیگه باشه تا از اون اندازه کمتر نشه

[yasharhi]

خیلی زیباست

[دانیال دزفولی]

خیلی زیباست¿ ایشون ایراد کارشون رو میخواد حد اقل یه چیزی بگید. ¡¡¡

[dreadful]

مرسي من هميشه كارام زيباست :))

نه داني جون حل نشد ،ايده ديگه اي نداري !؟ :)


+داني راست ميگه ،دوستان كسي نميتونه كمك كنه ؟

[kaamraan]

سلام خوب شده

فقط در زبان فارسی و هر زبانی کاما (،) بلافاصله بعد کلمه می‌آید و بعد یک اسپیس می‌خورد به عبارتی:

در آینده تگمیل شود ،می توانید توضیح مختصری در اینجا ببنید ،این متن
باید اینگونه شود:
در آینده تگمیل شود، می توانید توضیح مختصری در اینجا ببنید، این متن


بک‌گراند نداره وب‌سایت بهتره یک بک‌گراند اضافه کنی خصوصا در پایین صفحه به دلیل عدم وجود بک‌گراند فرم به سختی قابل دیدن هست.

تیترها را بهتر است از تگ‌های h1,h2,h3.. استفاده کنی تا اینکه در DIV قرار بدی

در پاراگراف‌ها line-height بگذار و دو خط فاصله داشته باشند که بهتر خوانده و نمایش داده شود.

بازهم نوشته‌ها مانند تیتر باید استاندارد باشند یعنی باید در تگ p قرار بگیرند نه در DIV

برخی از عکس‌هات بزرگتر از اندازه مورد نیاز هست که ضمن افزایش حجم سایت به خاطر اینکه توسط سی اس اس کوچک شدند کیفیت خود را از دست داده‌اند.


و در آخر موفق باشی

[farhadscript]

طراحی عالی ساده و شیک
یک بکگراند خیلی کم رنگ بهش میاد
فقط برای ایکون های مرورگر ها میتونی از ایکن واقعی اون ها استفاده کنی چون رنگ بندیشون یه خورده مشکل داره
درضمن نظر هم نمیتونستیم بدیم
برای ایکون پیجت یه جی ساده بزاری بسه جزئیاتش دیده نمیشه
و در اخر اون ایکون php 3d هست بدرد وبت نمیخوره
این خوبه:
http://www.up2www.com/uploads/1390113399111.jpg

[dreadful]

اقا فرهاد و اقا كامران واقعا ممنونم ،دمتون گرم !

كسي ديگه چيزي به ذهنش نمي خوره ؟ اخه مي خوام يه بار درستش كنم بره !

قبلا كه ميومدم اينجا كسايي بودن كه واقعا ميزدن تو ذوقم ! اينا كجان، الان نياز دارم بهشون :)
بازم ممنون دوستان

[دانیال دزفولی]

آیکون ای شبکه های اجتماعی رو یه کاری کن که هاور شد رنگ بگیره میتونی یه عکس بذاری بعد از فیلنتر های سی اس اس استفاده کنی خودم یه تایپیک در اینباره قبلا درست کرده بودم برو ببین
محتویات باید دسته بندی بشن که این برای بعده
میتونی یه اسلاید شو درست کنی تا چند تا نظر آخر مشتریان رو رد کنه
من با موبایل اومدم نمیدونم با پی سی چطوره ولی اجزای سایت جای مناسبی ندارن مثلا اونجا که نوشتی گیمو چیست تو هواس

[دانیال دزفولی]

گوگل هم لوگو زیاد داره از یکی دیگه به نظرم استفاده کن
جستجو در سایت هم در نظر بگیر

[دانیال دزفولی]

بعد اون آیکون ماله ارتباط با ما چرا اومده وسط و فقط یمت راست خط داره
اگه قراره به نظرم بیاد وسط هر دو طرف باید خط داشته باشه یه اصلا بره یه گوشه

[دانیال دزفولی]

شمار و ایمیل و عکست هم بره تو فوتر بهتر نیست؟
برای باتن ها هم هاور در نظر بگیر

[دانیال دزفولی]

نه نه تست کردم هاور دارن. :(

[_mojitaba_]

بعضی از آیکونای صفحت دورش حاشیه سفید و رنجه داره
بخصوص http://www.gimo.ir/img/p6-p2.png وقتی تکون میخوره بخاطر رنجش بد جوری رو مخه

[tekide]

سلام کارت عالیه
حاور هات یکم مشخص نیستن .
پیشنهاد اینه وقته موسو رو متن میکشی رنگ پیشفرض آبی هست اونو هم رنگ تمت کنی قشنگتره

::selection {
background: #6895df;
color: #222;
}
::-moz-selection {
background: #00b1d7;
color: #222;
}

[دانیال دزفولی]

ولی این کار فقط تو کرکم و مزیلا جواب میده

[tekide]

ولی این کار فقط تو کرکم و مزیلا جواب میده
من مثال برای موزیلا زدم شما از o ,و webkitهم استفاده کن ببین ج میده

[f_talebi]

خیلی خوب بود . این تصویرها که با اسکرول جا ب جا میشن رو چه جور ساختین؟ پارالاکس؟

[dreadful]

چه ربطی به پارالاکس داره ؟ o.o

مقدار اسکرول رو گرفتم ،اگه به یه مقدار خاصی رسید یه class خاص رو به اون شیپ اضافه یا کم میکنه (فایل javascript اش رو نیگاه کنید ،واضح هست )
:)

[thinkdiff]

از همه مهندسین عزیز عذر خواهی میکنم ولی هیچ کسی به ریسپانسیو نبودن سایت زیبای ایشون توجهی نکرد. دوست عزیز در حال حاضر ریسپانسیو بودن استاندارد سایت از نون شب برای سایت ها واجب تر هست رو این موضوع هم وقت بذارید بهتر میشه.

[alirezaoshz]

من الان كافي نتم و يكم رزوليشن صفحش پايينه كه قالب يكم بهم ميريزه !

[SA_Developer]

dreadful
Width ها رو درست نذاشتی به همین دلیل اسکرول افقی ظاهر شده و سمت راست قالبت ناحیه خالی وجود داره من یخوره برات درستش کردم این استایل رو چک کن:

@charset "utf-8";
/* CSS Document */

.header
{
width: 100%;
height: 350px;
background-color: #099;
}

.header .bg
{
width: 100%;
height: 350px;
background-image:url(img/header-bg.png);
position: absolute;
opacity: .8;
z-index: 1;
}

.header .cover
{
width: 100%;
height: 350px;
background-image:url(img/cover.png);
background-position:top;
background-size:1200px;
position: absolute;
transition:all .3s;
z-index: 2;

animation: myfirst 2s linear infinite;
-webkit-animation: myfirst 2s linear infinite; /* Safari and Chrome */
}

@keyframes myfirst
{
from {background-position:top;}
to {background-position:bottom;}
}

@-webkit-keyframes myfirst /* Safari and Chrome */
{
from {background-position:top;}
to {background-position:bottom;}
}

body
{
height: 5000px;
}

.header .txt
{
width: 100%;
height: 350px;
z-index: 3;
position: absolute;
}

.txt .title
{
width: 314px;
height: 122px;
background-image:url(img/top-title.png);
margin: 0px auto;
margin-top: 100px;
}

.cont
{
margin:0px auto;
padding: 20px;
}

.what
{
width: 100%;
height: 350px;
float: right;
}

.what .txt
{
height: 100%;
text-align: right;
}

.what .logo
{
float: right;
}

.logo .pic
{
margin-top: 75px;
margin-left: 50px;
}

.txt .top
{
color: #099;
margin-top: 125px;
font-size: 40px;
font-family: "wyekan";
}

.txt .bottom
{
color: #999;
margin-top: 15px;
font-family: "wyekan";
font-size: 24px;
line-height:25px;
}

.space
{
width: 800px;
margin: 0px auto;
-webkit-transition: all .5s;
-moz-transition: all .5s;
-ms-transition: all .5s;
-o-transition: all .5s;
transition: all .5s;
}

.space .left
{
width: 350px;
height: 1px;
float: left;

background: rgba(0,153,153,0);
background: -moz-linear-gradient(left, rgba(0,153,153,0) 0%, rgba(0,153,153,1) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0,153,153,0)), color-stop(100%, rgba(0,153,153,1)));
background: -webkit-linear-gradient(left, rgba(0,153,153,0) 0%, rgba(0,153,153,1) 100%);
background: -o-linear-gradient(left, rgba(0,153,153,0) 0%, rgba(0,153,153,1) 100%);
background: -ms-linear-gradient(left, rgba(0,153,153,0) 0%, rgba(0,153,153,1) 100%);
background: linear-gradient(to right, rgba(0,153,153,0) 0%, rgba(0,153,153,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#009999', endColorstr='#009999', GradientType=1 );
}

.space .right
{
width: 350px;
height: 1px;
float: right;

background: rgba(0,153,153,1);
background: -moz-linear-gradient(left, rgba(0,153,153,1) 0%, rgba(0,153,153,0) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0,153,153,1)), color-stop(100%, rgba(0,153,153,0)));
background: -webkit-linear-gradient(left, rgba(0,153,153,1) 0%, rgba(0,153,153,0) 100%);
background: -o-linear-gradient(left, rgba(0,153,153,1) 0%, rgba(0,153,153,0) 100%);
background: -ms-linear-gradient(left, rgba(0,153,153,1) 0%, rgba(0,153,153,0) 100%);
background: linear-gradient(to right, rgba(0,153,153,1) 0%, rgba(0,153,153,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#009999', endColorstr='#009999', GradientType=1 );
}

.space img
{
margin-left: 20px;
margin-top: -30px;
}

.powers
{
height: 1750px;
margin: 0px auto;
}

.power-a ,
.power-b
{
height: 250px;
margin-top: 1px;
}

.power-a .txt ,
.power-b .txt
{
width: 58%;
height: 250px;
overflow: hidden;
}

.power-a .pic ,
.power-b .pic
{
height: 250px;
}


.power-a .txt
{
float: left;
}

.power-a .pic
{
}

.power-b .txt
{
float: right;
}

.power-b .pic
{
float: left;
}

.txt .top-text
{
text-align: right;
font-family: "wyekan";
font-size: 24px;
color: #099;
margin-top: 75px;
-webkit-transition: all .5s;
-moz-transition: all .5s;
-ms-transition: all .5s;
-o-transition: all .5s;
transition: all .5s;
}

.txt .bottom-text
{
text-align: right;
font-family: "wyekan";
font-size: 20px;
color: #666;
margin-top: 25px;
-webkit-transition: all 1s;
-moz-transition: all 1s;
-ms-transition: all 1s;
-o-transition: all 1s;
transition: all 1s;
}

.pic img
{
position: absolute;
}

.p1-p1
{
width: 125px;
margin-top: 20px;
margin-left: 30px;
z-index: 2;
}

.p1-p2
{
width: 115px;
margin-top: 60px;
margin-left: 130px;
}

.p2-p1
{
width: 150px;
margin-top: 50px;
}

.p2-p2
{
width: 125px;
margin-top: 30px;
margin-left: 100px;
}

.p3-p1
{
width: 200px;
margin-left: 50px;
margin-top: 40px;
}

.p3-p2
{
width: 160px;
margin-left: 130px;
margin-top: 120px;
}

.p3-p3
{
width: 60px;
margin-left: 30px;
margin-top: 120px;
}

.p3-p4
{
width: 25px;
margin-top: 155px;
margin-left: 75px;
}

.p4-p1
{
width: 100px;
margin-left: 120px;
margin-top: 40px;
z-index: 4;
}

.p4-p2
{
width: 100px;
margin-left: 80px;
margin-top: 100px;
z-index: 3;
}

.p4-p3
{
width: 100px;
margin-left: 40px;
margin-top: 40px;
z-index: 2;
}

.p4-p4
{
width: 90px;
margin-top: 110px;
z-index: 1;
}

.p5-p1
{
width: 225px;
margin-left: 30px;
margin-top: 30px;
}

.p5-p2
{
width: 100px;
margin-left: 30px;
margin-top: 150px;
}

.p5-p3
{
width: 100px;
margin-top: 100px;
margin-left: 180px;
}

.p6-p1
{
width: 220px;
margin-top: 60px;
}

.p6-p2
{
width: 90px;
margin-top: 90px;
margin-left: 85px;


transform-origin:0% 99%;
-ms-transform-origin:0% 99%;
-webkit-transform-origin:26% 77%; /* Safari and Chrome */

animation: myfirstt .45s linear infinite;
-webkit-animation: myfirstt .45s linear infinite; /* Safari and Chrome */

}

.p7-p1
{
width: 220px;
margin-left: 30px;
margin-top: 90px;
}

.under-powers
{
height: 250px;
margin: 0px auto;
margin-top: 100px;
}

.under-power
{
display: inline-block;
width: 18%;
height: 250px;
}

.under-power .pic
{
width: 200px;
height: 125px;
}

.under-power .pic img
{
width: 100px;
margin-left: 50px;
}

.php
{
width: 150px !important;
margin-left: 25px !important;
margin-top: 15px;
}

.under-power .text
{
font-family: "SourceSansPro-ExtraLight";
font-weight:200;
font-size: 25px;
}

.under-power .ht
{
display: block;
margin: 0px auto;
width: 50px;
}

.under-power .cs
{
display: block;
margin: 0px auto;
width: 40px;
}

.under-power .ja
{
display: block;
margin: 0px auto;
width: 82px;
font-size: 20px;
}

.under-power .pho
{
display: block;
margin: 0px auto;
width: 82px;
font-size: 18px;
}

.under-power .ph
{
display: block;
margin: 0px auto;
width: 43px;
}


.under-power .knob
{
}

.knob .input
{
width: 150px;
height: 150px;
margin-left: 25px;
margin-top: -90px;
}

.space2
{
height: 50px;
margin-top: 100px;
}

.space2 .logo
{
width: 40px;
float: right;
margin-top: -40px;
}

.space2 .hr
{
float: left;
width: 85%;
height: 1px;

background: rgba(0,153,153,0);
background: -moz-linear-gradient(left, rgba(0,153,153,0) 0%, rgba(0,153,153,1) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0,153,153,0)), color-stop(100%, rgba(0,153,153,1)));
background: -webkit-linear-gradient(left, rgba(0,153,153,0) 0%, rgba(0,153,153,1) 100%);
background: -o-linear-gradient(left, rgba(0,153,153,0) 0%, rgba(0,153,153,1) 100%);
background: -ms-linear-gradient(left, rgba(0,153,153,0) 0%, rgba(0,153,153,1) 100%);
background: linear-gradient(to right, rgba(0,153,153,0) 0%, rgba(0,153,153,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#009999', endColorstr='#009999', GradientType=1 );


}

.space2 .txt
{
float: right;
font-family:"wyekan";
color: #666;
font-size: 30px;
margin-top: -18px;
margin-right: 10px;
}

.question
{
margin: 0px auto;
text-align: right;
}

.question .ask
{
font-family: "wyekan";
color: #099;
font-size: 25px;
margin-top: 30px;
}

.question .ans
{
font-family: "wyekan";
color: #666;
font-size: 20px;
margin-top: 20px;
}

.ques
{
margin-top: 80px;
}

.t-h
{
margin-right: 70px;
opacity: 0;
}

.tt-h
{
opacity: 0;
}

.picture
{
-webkit-transition: all .7s;
-moz-transition: all .7s;
-ms-transition: all .7s;
-o-transition: all .7s;
transition: all .7s;
}

.p1-p1-h
{
margin-left: 150px;
opacity: 0;
}

.p1-p2-h
{
margin-top: 100px;
opacity: 0;
}

.p2-p1-h
{
margin-top: -20px;
opacity: 0;
}

.p2-p2-h
{
transform: rotate(100deg);
-ms-transform: rotate(100deg); /* IE 9 */
-webkit-transform: rotate(100deg); /* Safari and Chrome */
opacity: 0;
}

.p3-p1-h
{
margin-left: 200px;
opacity: 0;
}

.p3-p2-h
{
margin-left: 00px;
opacity: 0;
}

.p3-p3-h
{
margin-top: 0;
opacity: 0;
}

.p3-p4-h
{
margin-top: 100px;
opacity: 0;
}

.p4-p1-h
{
transform: rotate(-200deg);
-ms-transform: rotate(-200deg); /* IE 9 */
-webkit-transform: rotate(-200deg); /* Safari and Chrome */
margin-left: 0;
opacity: 0;

}

.p4-p2-h
{
transform: rotate(-200deg);
-ms-transform: rotate(-200deg); /* IE 9 */
-webkit-transform: rotate(-200deg); /* Safari and Chrome */

margin-left: -100px;
opacity: 0;
}

.p4-p3-h
{
transform: rotate(-200deg);
-ms-transform: rotate(-200deg); /* IE 9 */
-webkit-transform: rotate(-200deg); /* Safari and Chrome */

margin-left: -150px;
opacity: 0;
}

.p4-p4-h
{
transform: rotate(-200deg);
-ms-transform: rotate(-200deg); /* IE 9 */
-webkit-transform: rotate(-200deg); /* Safari and Chrome */

margin-left: -200px;
opacity: 0;
}

.p5-p1-h
{
margin-top: 0;
opacity: 0;
}

.p5-p2-h
{
transform: rotate(-400deg);
-ms-transform: rotate(-400deg); /* IE 9 */
-webkit-transform: rotate(-400deg); /* Safari and Chrome */

opacity: 0;
}

.p5-p3-h
{
margin-left: 200px;
opacity: 0;
}

.p6-p1-h
{
opacity: 0;
}

.p6-p2-h
{
opacity: 0;
}

.p7-p1-h
{
margin-left: 200px;
opacity: 0;
}

@keyframes myfirstt
{
from
{
transform: rotate(10deg);
-ms-transform: rotate(10deg); /* IE 9 */
-webkit-transform: rotate(10deg); /* Safari and Chrome */
}

to
{
transform: rotate(20deg);
-ms-transform: rotate(20deg); /* IE 9 */
-webkit-transform: rotate(20deg); /* Safari and Chrome */
}
}

@-webkit-keyframes myfirstt /* Safari and Chrome */
{
from
{
transform: rotate(20deg);
-ms-transform: rotate(20deg); /* IE 9 */
-webkit-transform: rotate(20deg); /* Safari and Chrome */
}

to
{
transform: rotate(40deg);
-ms-transform: rotate(40deg); /* IE 9 */
-webkit-transform: rotate(40deg); /* Safari and Chrome */
}
}

.port
{
width: 800px;
margin: 0px auto;
margin-top: 50px;
}

.port .title
{
width: 100%;
height: 30px;
}

.port .pic
{
width: 100%;
height: 600px;
}

.title .right
{
color: #099;
font-family:"wyekan";
text-align: right;
float: right;
font-size: 17px;
}

.title .left
{
color: #666;
font-family:"wyekan";
text-align: left;
float: left;
font-size: 17px;
}

.pic .new
{
width: 800px;
height: 570px;
background-image:url(img/pic1-new.png);
position: absolute;
border:5px solid #333;
}

.pic .new2
{
width: 800px;
height: 570px;
background-image:url(img/pic2-new.png);
position: absolute;
border:5px solid #333;
}

.pic .old
{
width: 600px;
height: 570px;
background-image:url(img/pic1-old2.png);
float: left;
z-index: 2;
border:5px solid #333;
}

.pic .old2
{
width: 300px;
height: 570px;
background-image:url(img/pic2-old.png);
float: left;
z-index: 2;
border:5px solid #333;
}


#egrip{
width: 40px;
height: 40px;
background-color: #333;
position: absolute;
z-index: 10;
background-image:url(img/hand.png);
background-size:30px;
background-repeat:no-repeat;
background-position:center;
margin-top: 265px;
border-top-left-radius: 20px;
border-bottom-left-radius: 20px;
}

.port .but
{
clear: both;
width: 100%;
}

.but .name
{
width: 148px;
margin: 0px auto;
border-radius:4px;
border: 1px solid #099;
color: #099;
cursor: pointer;
font-family: "wyekan";
font-size: 18px;
padding: 15px;
text-align: center;
background-color: #fff;
-webkit-transition: all .3s;
-moz-transition: all .3s;
-ms-transition: all .3s;
-o-transition: all .3s;
transition: all .3s;
}

.but .name:hover
{
background-color: #099;
color: #fff;
}

.space3
{
height: 50px;
margin: 0px auto;
margin-top: 100px;
}

.space3 .logo
{
width: 60px;
float: right;
margin-top: -40px;
}

.space3 .hr
{
float: left;
width: 780px;
height: 1px;

background: rgba(0,153,153,0);
background: -moz-linear-gradient(left, rgba(0,153,153,0) 0%, rgba(0,153,153,1) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0,153,153,0)), color-stop(100%, rgba(0,153,153,1)));
background: -webkit-linear-gradient(left, rgba(0,153,153,0) 0%, rgba(0,153,153,1) 100%);
background: -o-linear-gradient(left, rgba(0,153,153,0) 0%, rgba(0,153,153,1) 100%);
background: -ms-linear-gradient(left, rgba(0,153,153,0) 0%, rgba(0,153,153,1) 100%);
background: linear-gradient(to right, rgba(0,153,153,0) 0%, rgba(0,153,153,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#009999', endColorstr='#009999', GradientType=1 );


}

.space3 .txt
{
float: right;
font-family:"wyekan";
color: #666;
font-size: 30px;
margin-top: -18px;
margin-right: 10px;
}

.question .ask2
{
font-family: "wyekan";
color: #099;
font-size: 25px;
margin-top: 30px;
margin-right: 40px;
}

.question .ans2
{
font-family: "wyekan";
color: #666;
font-size: 23px;
margin-top: 20px;
float: left;
width: 700px;
}

.simi
{
float: right;
margin-top: 25px;
margin-right: 40px;
}

.space-2
{
width: 800px;
margin: 0px auto;
margin-top: 175px;
}

.space-2 .left
{
width: 350px;
height: 1px;
float: left;

background: rgba(0,153,153,0);
background: -moz-linear-gradient(left, rgba(0,153,153,0) 0%, rgba(0,153,153,1) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0,153,153,0)), color-stop(100%, rgba(0,153,153,1)));
background: -webkit-linear-gradient(left, rgba(0,153,153,0) 0%, rgba(0,153,153,1) 100%);
background: -o-linear-gradient(left, rgba(0,153,153,0) 0%, rgba(0,153,153,1) 100%);
background: -ms-linear-gradient(left, rgba(0,153,153,0) 0%, rgba(0,153,153,1) 100%);
background: linear-gradient(to right, rgba(0,153,153,0) 0%, rgba(0,153,153,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#009999', endColorstr='#009999', GradientType=1 );
}

.space-2 .right
{
width: 350px;
height: 1px;
float: right;

background: rgba(0,153,153,1);
background: -moz-linear-gradient(left, rgba(0,153,153,1) 0%, rgba(0,153,153,0) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0,153,153,1)), color-stop(100%, rgba(0,153,153,0)));
background: -webkit-linear-gradient(left, rgba(0,153,153,1) 0%, rgba(0,153,153,0) 100%);
background: -o-linear-gradient(left, rgba(0,153,153,1) 0%, rgba(0,153,153,0) 100%);
background: -ms-linear-gradient(left, rgba(0,153,153,1) 0%, rgba(0,153,153,0) 100%);
background: linear-gradient(to right, rgba(0,153,153,1) 0%, rgba(0,153,153,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#009999', endColorstr='#009999', GradientType=1 );
}

.space-2 img
{
margin-left: 15px;
margin-top: -25px;
}


.quote-form {
margin: 0 auto;
width: 600px;
margin-top: 50px;
}
.quote-form p {
background-color: #f7f7f7;
margin-bottom: 12px;
overflow: hidden;
padding: 3px 16px 3px 3px;
text-align: left;
}
.quote-form p:hover {
background-color: #f2f2f2;
}
.quote-form label {
display: inline-block;
margin-top: 16px;
font-family: "wyekan";
float: right;
}
.quote-form input[type="text"],
.quote-form input[type="email"],
.quote-form input[type="number"],
.quote-form textarea {
border: none;
font: "wyekan";
float: left;
height: 54px;
margin-right: 16px;
padding: 0 16px;
width: 350px;
text-align: right;
}
.quote-form .select-container {
height: 60px;
}
.quote-form .select-container select {
float: left;
font-size: 16px;
margin: 16px 0 16px 16px;
width: 350px;
}
.quote-form textarea {
height: 200px;
padding: 16px;
max-width:350px;
min-width:350px;
min-height:200px;
max-height:500px;
}

*{outline:none;}

.cta .btn
{
width: 148px;
margin: 0px auto;
margin-top: 30px;
border-radius:4px;
border: 1px solid #ccc;
color: #ccc;
cursor: pointer;
font-family: "wyekan";
font-size: 18px;
padding: 15px;
text-align: center;
background-color: #fff;
margin-left: 226px;
-webkit-transition: all .3s;
-moz-transition: all .3s;
-ms-transition: all .3s;
-o-transition: all .3s;
transition: all .3s;
}

.cta .btn:hover
{
background-color: #ccc;
color: #fff;
}

.contact
{
width: 425px;
height: 150px;
margin: 0px auto;
margin-top: 50px;
}

.pic
{
width: 150px;
height: 150px;
float: left;
}

.pic .man
{
width: 150px;
border-radius:50%;
border:1px solid #666;
}

.contact .txt
{
width: 250px;
height: 150px;
float: right;
}

.txt .phone
{
width: 100%;
height: 25px;
font-family: "SourceSansPro-ExtraLight";
font-weight: 100;
font-size: 23px;
color: #099;
margin-top: 25px;
}

.txt .email
{
width: 100%;
height: 25px;
font-family: "SourceSansPro-ExtraLight";
font-weight: 100;
font-size: 23px;
color: #099;
}

.txt .social
{
width: 100%;
height: 50px;
margin-top: 10px;
}

.social .facebook
{
width: 50px;
height: 50px;
background-image:url(img/facebook.png);
background-repeat:no-repeat;
background-position:center;
cursor: pointer;
float: left;
margin-left: -15px;
}

.social .facebook:hover
{
background-image:url(img/facebook-hover.png);
}


.social .twitter
{
width: 50px;
height: 50px;
background-image:url(img/twitter.png);
background-repeat:no-repeat;
background-position:center;
cursor: pointer;
float: left;
margin-left: 5px;
}

.social .twitter:hover
{
background-image:url(img/twitter-hover.png);
}


.social .google
{
width: 50px;
height: 50px;
background-image:url(img/google.png);
background-repeat:no-repeat;
background-position:center;
cursor: pointer;
float: left;
margin-left: 5px;
}

.social .google:hover
{
background-image:url(img/google-hover.png);
}

.footer
{
background-color: #333;
width: 100%;
height: 100px;
margin-top: 50px;
}

.footer-cont
{
width: 1000px;
margin: 0px auto;
}

.footer-cont img
{
float: right;
margin-top: 15px;
}

.footer-cont .txt
{
color: #666;
font-family: "wyekan";
font-size: 20px;
float: right;
margin-top: 40px;
margin-right: 20px;
}

.space-hidden
{
opacity: 0;
}

a {text-decoration: none;}

[arash20]

سلم من آرش تازه اومدم اینجا میخواستم بدونم از چه نرم افزاری استفاده کردی و سایت رو با html 5 ساختی؟؟؟؟؟؟؟؟؟؟

[danial.saeedi]

سلام دوست عزیز!برای طراحی نرم افزاری لازم نیست.
کارتون فوق العادس.من خیلی دوستش دارم.بهتر بود فقط یک بار انیمیشن اجرا بشه مثلا وقتی دوباره به پایین می رم انیمیشن ها اجرا می شن.و گوگل کروم یکم تیکه سفید افتاده.عکس php به بقیه عکس ها نمی خوره.وردپرس می زاشتی قشنگ تر بود.
و در قسمت نظرات مشتریان یک نظر با نام واقعی بزار.در کل طراحیتون فوق العادس.

[dreadful]

ممنون دوستان

gimo.ir آپدیت شد

سعی کردن روی مشکلاش کار کنم ، مخصوصا سئو

آقای SA_Developer خیلی ممنون ولی من تا حالا داشتم روش کار میکردم و css ام عوض شده کلا ! میشه بگید کجا هاش مشکل داشت که نگاه بندازم ،بازم ممنون بابت زحمتی که کشیدی !

موفق باشید

+ کد هاتونو روی قالب اعمال کردم ولی اینجوری نشون میده ها ! O.o

http://dreadful.persiangig.com/other/Untitledaaa.png

[bobSilon]

بهتر بود که وقتی یکی از عناصر فرم که به حالت انتخاب در میاد(focus) یه تغییر ظاهری داشته باشه. مثلا یه خورده رنگ باکسش تیره تر بشه یا
همرنگ بیس رنگ صفحه بشه(که یه چیزی بین آبی و سبزه)، یا اینکه یه border-right واسش تعریف کنی که تو حالت پیش فرض همرنگ باکس
هست، و تو حالت focus به رنگ بیس صفحه در میاد.

[SA_Developer]

dreadful (http://barnamenevis.org/member.php?298831-dreadful) جان
من زیاد نتونستم وقت بذارم اما منظورم این بود که باید Width المنت ها رو درست ست کنی.
الان رزولیشن من 768*1024 هست اما باز اسکرول افقی ظاهر شده
برای طراحی رسپانسیو باید همیشه Width روبصورت درصدی مقدار دهی کنی و بعدش سایت رو با رزولیشن های مختلف چک کن.
از این سایت ها میتونی برای چک کردن رسپانسیو بودن سایتت استفاده کنی:
http://responsivetest.net
http://responsivedesignchecker.com/
اما بهترین روش تغییر دادن رزولیشن مانیتورته.
موفق باشی.