رفتن به مطلب
توقف فعالیت انجمن وردپرس پارسی، و ادامه فعالیت در انجمن رسمی وردپرس(کلیک کنید) ×
توقف فعالیت انجمن وردپرس پارسی، و ادامه فعالیت در انجمن رسمی وردپرس(کلیک کنید)

وضعیت قالب در حالت restore down

shayan

توسط shayan،
در برنامه نویسی استاتیک

دنبال‌کننده 0

پست های پیشنهاد شده

shayan

shayan 116

ارسال شده در
ارسال شده در

سلام

من تازه با طراحی سایت آشنا شدم و اطلاعات زیادی تو این ضمینه ندارم

دارم یه قالب طراحی میکنم که به این مشکل بر خوردم

اینه که وقتی پنجره مرورگر در حالت عادی هست قسمت های مختلف سایت سر جاشون هستند ولی وقتی مرورگر یه خورده کوچک تر میشه

یعنی همون restore down میشه

قالب به هم میریزه و جاشون تغییر میکنه

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

تحت هیچ شرایطی

کد هام رو هم میزارم ببینید مشکل از کجاشه

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>انصار الصلاة</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<!..............header...............!>
<div id="header">
<a href="#"> <img src="header.gif" width="277" height="55" /></a>
</div>
<br/>
<br/>
<br/>
<br/>
<!...................................!>
<div id="doa">
<!......................NAV...........!>
<div id="nav">
<ul class="menu">
<li>
<a href="#"><span>صفحه نخست</span></a>
</li>
<li>
<a href="#">
<span>اخبار</span></a>
</li>
<li>
<a href="#"><span>مقالات</span></a>
</li>
<li>
<a href="#"><span>سخنرانی</span></a>
</li>
<li>
<a href="#"><span>گالری تصاویر</span></a>
</li>
<li>
<a href="#"><span>فایل های صوتی</span></a>
</li>
<li>
<a href="#"><span>درباره هیئت</span></a>
</li>
<li>
<a href="#"><span>تماس با ما </span></a>
</li>
</ul>
</div>
<br/>
<!...........................doa...............!>
<p style="font-family:'Adobe Arabic'; color:black;" >
<marquee direction="right" behavior="scroll" >
اَللّهُمَّ كُنْ لِوَلِيِّكَ الْحُجَّةِ بْنِ الْحَسَنِ صَلَواتُكَ عَلَيْهِ وَعَلى آبائِهِ في هذِهِ السّاعَةِ وَفي كُلِّ ساعَةٍ وَلِيّاً وَحافِظاً وَقائِداً وَناصِراً وَدَليلاً وَعَيْناً حَتّى تُسْكِنَهُ أَرْضَكَ طَوْعاً وَتُمَتِّعَهُ فيها طَويلا
</marquee>
</p>
</marquee>
<!....................time.................!>
</div>
<div id="time">
</div>
<br/>
<div class="sidebar">
</div>
<br/>
<br/>
<br/>
<div class="sidebar-menu">
</div>
</body>
</html>

CSS


body{
background:url(bg.gif);
}
#header{
float:right;
margin-top:20px;
margin-right:80px;
}
#doa{
width: 1000px;
height: 35px;
background-color:#2abbea;
float:right;
    margin-right:80px;
}

.menu {
direction:rtl;
margin-top:50px;
list-style:none;
margin:-25px;
   margin-right:300px;
}

.menu li{
display:inline-block;
width:auto;
line-height:27px;
height:27px;
overflow:visible;
position:relative;
bottom:0;
}
.m2 li {
margin-left:3px;

}
.menu li a {
position:relative;
display:block;
padding:3px;
height:21px;
background:#2abbea;
    background-image: -webkit-gradient(linear, top right, bottom left, from(#2abbea), to(#2abbea));
    background-image: -webkit-linear-gradient(top, #2abbea, #2abbea);
    background-image:    -moz-linear-gradient(top, #2abbea, #2abbea);
    background-image:	  -o-linear-gradient(top, #2abbea, #2abbea);
    background-image: linear-gradient(to bottom, #2abbea, #2abbea);
bottom:0;
margin:0;
top:0;
zoom: 1;
text-decoration:none;
-moz-transition: all 0.3s ease-out; 
-o-transition: all 0.3s ease-out; 
-webkit-transition: all 0.3s ease-out; 
transition: all 0.3s ease-out; 
color:#000;
}
.menu li a:hover {
height:31px;
top:-10px;
}
#time{
width: 180px;
height: 35px;
background-color:#2abbea;
float:right;
margin-right:5px;
  margin-left:80px;
position:relative;
}
.sidebar{
width: 240px;
height: 23px;
background-color:#2abbea;
float:right;
margin-top:12px;
margin-right:80px;
border-radius:10px;
  }
.sidebar-menu{
width: 240px;
height: 261px;
background-color:#0e97c3;
float:right;
margin-right:80px;
border-radius:10px;

پیشاپیش ممنون از کمکتون

;)

لینک به ارسال
Farid

Farid 2281

ارسال شده در
ارسال شده در

سلام

هیچ راهی وجود نداره که همونجور بمونن ! شما باید طرحت رو رسپانسیو بزنی که با عرض مرورگر طرح هم عوض شه و یا اینکه عناصر صفحه کمی کوچکتر بشن // با توجه به این خودتون میگید تازه با طراحی آشنا شدید ، خیلی سخته براتون که طراحی رسپانسیو یاد بگیری

لینک به ارسال
shayan

shayan 116

ارسال شده در
  • مالک
ارسال شده در

دوستان دیگه راه حل بهتری ندارند من از شر این قالب راحت شم؟؟؟؟؟

تو css چیزی نیست که این کار رو انجام بده؟؟

لینک به ارسال
Morteza

Morteza 34190

ارسال شده در
ارسال شده در

خوب این کد کلا تا یه حد مشخصی درست نشون میده و عادی هست

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

  • امتیاز 1
لینک به ارسال

لطفا برای ارسال دیدگاه وارد شوید

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



ورود به حساب کاربری
دنبال‌کننده 0
برو به فهرست موضوع ها
×
×
  • اضافه کردن...