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

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


لینک به پست

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

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

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


display:block

یا


display:table;

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


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

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

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


لینک به پست

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

<!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

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


لینک به پست
کدهاتون اینطوری قابل بررسی نیست چند نکته هست که پاسخ بدهید بهتر از این کدهاست 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

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


لینک به پست

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

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

static:

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

absolute:

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

fixed:

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

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

relative:

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

مثال

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

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

pos-test.zip

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


لینک به پست

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


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

ترمیم کنید

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

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


لینک به پست

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

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

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

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


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

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

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


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

  • مطالب مشابه

    • توسط napo
      سلام 
      افزونه max mega menu  رو دانلود کردم ولی متاسفانه راستچین نیست یعنی زیر منو رو سمت راست ایجاد میکنه به جای اینکه در سمت چپ نشون بده همونطوری که توی عکس مشخصه بعد انتخاب دوتا زیر منو کلا از صفحه خارج میشه
      اگه میشه کمکم کنید
      اگه کسی افزونه ای دیگه میشناسه که هم راستیچینه هم اکاردئونی ممنون میشم معرفی کنه

    • توسط oonchiye
      سلام
      تنظیمات مربوط به افزونه رو انجام دادم برگه ها موجود هستش 
      شرت کد های مربوط هم درسته 
      فقط وقتی دکه پرداخت رو میزنی صفحه تسویه حساب فقز اسم برگه رو میاره 
      مینویسه check uot فقط
      چیکار کنم خیلی لازم دارم 
    • توسط behi13
      با سلام
      دوستام و اساتید محترم یک سوال
      من به سایت دوزبانه با افزونه wpml درست کردم الان یک مشکل هست توی گوگل صفحه اول سایت ایندکس شده و توی فارسی مشکلی ندارم
      ولی توی زبان انگلیسی وقتی توی گوگل به انگلیسی سرچ میکنم بازهم با نام و فارسی میاد
      ممنون میشم من و راهنمایی کنید
    • توسط j1989m
      سلام
      توی قسمت افزودن نوشته و از طریق پرونده های رسانه ای یه عکس انتخاب میکنم و منتشر میکنم. توی سایت عکس رو نشون میده اما این کدها رو هم میاره:
      [caption id="attachment_154" align="aligncenter" width="300"] [/caption]
      درواقع عکس بین دوتا caption بالا قرار میگیره.
      این مشکل توی افزودن برگه نیست.
      لطفا راهنمایی کنید
      خیلی فوریه
      ممنون
    • توسط xboby
      سلام،
      من سایتی با ورد پرس طراحی کردم و می خواهم با:
      یک برنامه تمام پستهای موجود در کانال تلگرامی که بنام آن سایت ایجاد کر ده ام را
      بتوانم از موبایلم دانلود کنم و بعد در آن سایت قرار دهم:
      آیا چنان برنامه ای وجود دارد؟ لطفا راهنمائی ام بفرمائید.
                                   متشکرم