gtanori

مشکل در سی اس اس

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

ارسال شده در (ویرایش شده)

سلام یه سوال من می خواهم الان یه قالب طراحی کنم با سی اس اس ولی خیلی اذیت می کنه مثلا برای ست شدن صفحه وسط روی منو چپ یا راست نیافته باید پیکسل پیسکل امتحان کنم left , top رو که روش نیافته راهی نیست به سرعت مثلا بیاد وسط باکس

این کدم است

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR...l1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<title></title>

<style type="text/css">

body{

background-image: url(Wallpapers.Mania.S.13!-www.downloadKral.com/Wallpapers Mania #030 (23).jpg);

}

#main{

border:2px solid #FF00FF ;

width: 100%;

height:900px;

background-image: url(Wallpapers.Mania.S.13!-www.downloadKral.com/Wallpapers Mania #030 (23).jpg);

}

#left {

border:4px solid #33FF00;

width:200px ;

height: 800px;

top:62px ;

position: absolute;

}

#right{

border:4px solid #3333FF ;

width: 200px;

height:800px;

position: absolute;

right:2px;

top:62px ;

}

#menu{

border:2px solid #FF3333 ;

width: 100%;

height: 50px;

background-image: url() ;

}

.list{

list-style: none;

float:right;

left:200px;

}

.list li{

float: left;

}

.list a{

display: block;

margin:5px;

padding:3px;

background-color:#FF0000;

border:1px dotted #FF3300;

text-decoration: none

}

#center{

border:2px solid #FF00FF ;

width: 915px;

height:800px;

right:10px;

left:208px;

top: 62px ;

position: relative;

}

</style>

</head>

<body>

<div id="main">

<div class="menu">

<img src="Wallpapers.Mania.S.13!-www.downloadKral.com/Wallpapers Mania #030 (7).jpg" />

<ul class="list">

<li><a href="#">درباره ما</a></li>

<li><a href="#">محصولات</a></li>

<li><a href="#">تماس با ما</a></li>

<li><a href="#">درباره ما</a></li>

</ul>

</div>

<div id="left">

</div>

<div id="right"></div>

<div id="center"></div>

</div>

</body>

</html>

ویرایش شده در توسط Morteza
0

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


لینک به پست

کدهاتون اینطوری قابل بررسی نیست

چند نکته هست که پاسخ بدهید بهتر از این کدهاست

position لایه ها چقدر است شرایطی که برای تنظیم فرمودیدذ در سه مقدار relative و absolute و fixed تاثیر دارند (مقدار top و left) که لایه های اصلی نباید دو خاصیت absolute و fixed را داشته باشند و در حالت relative ابتدا لایه را با


display:block

یا


display:table;

یک بلوک نمایید و بعد با استفاده از کد زیر به وسط صفحه انتقال دهید


margin-left:auto;
margin-right:auto;

در مورد عکس پشت زمینه هم باید کدهای style.css بررسی بشه نه این کدها ولی بهتره اگر سایت آنلاینه آدرس بدید و در غیر اینصورت از صفحه اجراشده سورس کد تهیه کنید و داخل یک فایل txt برای بررسی بگذارید

2

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


لینک به پست

ارسال شده در (ویرایش شده)

این کدینگ با توجه به کدینگ خودته

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR...l1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<title></title>

<style type="text/css">

body{

background-image: url(Wallpapers.Mania.S.13!-www.downloadKral.com/Wallpapers Mania #030 (23).jpg);

}

#main{

border:2px solid #FF00FF ;

width: 100%;

height:900px;

background-image: url(Wallpapers.Mania.S.13!-www.downloadKral.com/Wallpapers Mania #030 (23).jpg);

}

#menu{

border:2px solid #FF3333 ;

overflow: hidden;

background: orange;

width: 100%;

height: 50px;

background-image: url() ;

}

.list{

list-style: none;

float:right;

left:200px;

}

.list li{

float: left;

}

.list a{

display: block;

margin:5px;

padding:3px;

background-color:#FF0000;

border:1px dotted #FF3300;

text-decoration: none

}

.position {overflow: hidden;}

#left {

border:4px solid #33FF00;

width:200px ;

height: 800px;

float: left;

}

#right{

border:4px solid #3333FF ;

width: 200px;

height:800px;

float: right;

}

#center{

border: 2px solid #FF00FF;

width: 900px;

height: 800px;

float: left;

margin-left: 5px;

}

</style>

</head>

<body>

<div id="main">

<div id="menu">

<img src="Wallpapers.Mania.S.13!-www.downloadKral.com/Wallpapers Mania #030 (7).jpg" />

<ul class="list">

<li><a href="#">درباره ما</a></li>

<li><a href="#">محصولات</a></li>

<li><a href="#">تماس با ما</a></li>

<li><a href="#">درباره ما</a></li>

</ul>

</div>

<div class="position">

<div id="left"></div>

<div id="center"></div>

<div id="right"></div>

</div>

</div>

</body>

</html>

ویرایش شده در توسط Morteza
1

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


لینک به پست
کدهاتون اینطوری قابل بررسی نیست چند نکته هست که پاسخ بدهید بهتر از این کدهاست position لایه ها چقدر است شرایطی که برای تنظیم فرمودیدذ در سه مقدار relative و absolute و fixed تاثیر دارند (مقدار top و left) که لایه های اصلی نباید دو خاصیت absolute و fixed را داشته باشند و در حالت relative ابتدا لایه را با
 display:block 

یا

 display:table; 

یک بلوک نمایید و بعد با استفاده از کد زیر به وسط صفحه انتقال دهید

 margin-left:auto; margin-right:auto; 

در مورد عکس پشت زمینه هم باید کدهای style.css بررسی بشه نه این کدها ولی بهتره اگر سایت آنلاینه آدرس بدید و در غیر اینصورت از صفحه اجراشده سورس کد تهیه کنید و داخل یک فایل txt برای بررسی بگذارید

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

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

راستی میشه یه کم در مورد postion و خاصیت هاش بگید چون الان مشکلی که برا م پیش اومد بخاطر همون بود

project.htm

0

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


لینک به پست

راستی میشه یه کم در مورد postion و خاصیت هاش بگید چون الان مشکلی که برا م پیش اومد بخاطر همون بود

postion همونطور که از اسمش بر می آد پز لایه را در صفحه ایجاد می کند و مقادیر پز های اصلی عبارتند از

static:

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

absolute:

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

fixed:

مانند لایه قبل اما کل فضای قابل مشاهده ابعاد مونیتور است (اسکرول نمی شود) و محلش همیشه در صفحه ثابت است

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

relative:

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

مثال

فرض کنید یک نوار ابزار می خواهید در بالای صفحه داشته باشید که همیشه در جای خود ثابت باشد و در آن یک لایه ul دارید و چند li که بعضی از li دارای زیر مجموعه هایی هستند که می خواهید در صورت حرکت موس روی آنها باز شند و باز و بسته شدنشان آسیبی به طراحی مابقی صفحه سایت نزند در این حالت لایه اصلی را fixed در نظر می گیرید و li های دارای زیر مجموعه را relative و لایه های کشویی را absolute و نتیجه ای مشابه کد زیر خواهید داشت

کد را در برگه نوت پد با پسوند html ذخیره کنید و از طریق نمایشگر باز کنید

pos-test.zip

2

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


لینک به پست

استایل بندی فایلی که پیوست بودید را با حذف پزیشن ها و اضافه کردن دو خاصیت


display:inline-block;*/block;inline,table,...*/
float:left;*/right,none*/

ترمیم کنید

مقادیر داخل */... */ مقدارهای دیگری هستند که می توانید قرار دهید و تست کنید

2

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


لینک به پست

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

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

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

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


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

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

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


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

  • مطالب مشابه

    • توسط hassan_thari
      سلام من دو ماهه یه سایت رو راه انداختم از هر پنج پستی که تو سایت میزارم سه تاشون ایندکس نمیشه مشکل چی هست؟
    • توسط naderi
      سلام .. برای توسعه یک وب سایت با قالب Eduma وردپرس میخوایم یه سری قابلیت ها رو بهش اضافه کنیم .. از دوستان کسی هست که بتونه به ما کمک کنه؟
    • توسط Morteza
      قوانین کلی انجمن
      1- در هنگام ثبت نام از کلمات مناسب جهت نام کاربری استفاده نمایید. نام های کاربری حاوی کلمات نامناسب ، نام های کاربری که جنبه تبلیغاتی داشته و یا نام های کاربری که نام یک سایت می باشند ، سریعا حذف خواهند شد.
      2- به دیگران احترام بگزارید. با هرگونه بی احترامی برخورد جدی و حتی منجر به قطع دسترسی کاربر خاطی خواهد شد.
      3- در انتخاب آواتر و امضا دقت کنید و از تصاویر و کلمات موهون و نامناسب استفاده ننمایید. توجه کنید که امضا هایی که حاوی تصاویر و کلمات موهون و نامناسب باشند و یا جنبه تبلیغاتی داشته باشند سریعا حذف خواهند شد و در صورت تکرار با فرد خاطی برخورد خواهد شد.
      4- برای مطالب خود از عنوان مناسب و گویا استفاده نمایید. در عنوان مطالب خود از عبارات و کلمه هایی مانند : کمک کنید ، درخواست فوری ، نیاز شدید ، تورو خدا کمکم کنید ، خیلی مهم و جملاتی شبیه به این خودداری نمایید.
      5- حتما قبل از ایجاد یک موضوع در انجمن جستجو کنید و از ایجاد مطالب تکراری خودداری نمایید.
      6- از اسپم کردن موضوعات پرهیز کنید. جهت دریافت پاسخ صبر داشته باشید. برای تشکر از دکمه تشکر استفاده کنید.
      7- فارسی بنویسید و از فینگلیش نوشتن خودداری کنید. در غیر اینصورت با فرد خاطی برخورد خواهد شد.
      8- فعالیت های تجاری را فقط در بخش مشخص شده انجام دهید و از ایجاد موضوعاتی با جنبه تجاری در دیگر بخشها خودداری نمایید. از دادن پاسخهایی که جنبه تجاری و یا تبلیغی دارند خودداری نمایید. در صورت مشاهده چنین پست هایی با فرد خاطی برخورد خواهد شد.
      9- گروه وردپرس پارسی هیچگونه مسئولیتی در مورد فعالیت های بخش تجاری ندارد و تمامی مسئولیت به عهده ایجاد کننده موضوع است.
      10-هرگونه بحث سیاسی - مذهبی در این انجمن ممنوع می باشد. هرگونه توهین و مجادله و مباحثه در مباحث دینی و سیاسی ممنوع بوده و تاپیک های اینچنینی حذف و کاربران خاطی محروم می شوند. در صورت تکرار فرد خاطی برای همیشه از انجمن اخراج می شود.
      11- ارائه شماره تماس و ایمیل جهت همکاری و یا خرید و فروش و یا هرگونه مورد دیگر بصورت عمومی در انجمن ممنوع است. جهت تبادل موارد ذکر شده از طریق پیام خصوصی اقدام کنید.
      12- هرگونه درخواست کامل سازی پوسته در انجمن ممنوع است. اگر نیاز به تکمیل کد بخش خاصی از پوسته را دارید باید درخواست خود را در یک تاپیک جدید مطرح کنید و از درخواست تکمیل کدنویسی و یا طراحی یک پوسته جدا خودداری کنید.
      13- هرگونه بحث در مورد تکمیل و اشکال زدایی پوسته های ریپ در انجمن ممنوع است. اگر نیاز به تکمیل کد بخش خاصی از پوسته را دارید باید درخواست خود را در یک تاپیک جدید مطرح کنید و از درخواست تکمیل کدنویسی و یا طراحی یک پوسته ریپ جدا خودداری کنید.
      14- هرگونه درخواست فایل/پوسته/افزونه و سایر محصولهای تجاری در انجمن ممنوع است.
      15- هرگونه پرسش و بحث درباره محصولهای تجاری در انجمن ممنوع است. پشتیبانی محصولهای تجاری به عهده سازنده/فروشنده آن است.
      16- به هیچ طریقی از کاربران دیگر مشخصات ورود به سایت/سرور آنها را درخواست نکنید. در صورت نیاز کاربر در پیام خصوصی اطلاعات را ارسال خواهد کرد و نیازی به مطرح کردن این مورد نیست، توجه فرمایید انجمن هیچ مسئولیتی در این مورد بع عهده نخواهد گرفت. همچنین در صورت مشاهده درخواست ورود از کاربران دیگر، اخطار و در صورت تکرار کاربر خاطی از انجمن اخراج خواهد شد.
      بروزرسانی ششم.
    • توسط HADI.RBL
      سلام خسته نباشید من وقتی یک برگه رو در وردپرس خودم میسازم هرکار میکنم در سایتم نمایش داده نمیشه هرکی میدونه مشکل از کجاست لطفا راهنمایی کنه >. 
    • توسط amirdehghani
      سلام ببخشید من داخل سایت ام query monitor نصب کردم بعد بهم ارور slow query میده  میگه دو تا slow query داری 
      الان باید چیکار کنم که درست بشن با افزونه میشه درستش کرد یا باید کد های query رو تغییر بدم 
      لطفا کمک کنید خیلی مهمه تا امشب باید درستش کنم تحویل بدم