رفتن به مطلب

سوالاتی درباره طراحی قالب (css&html)


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

درود دوستان

من یه قالب پس اس دی خودم طراحی کردم و با اندک اطلاعاتی از اچ تی ام ال و سی اس اس شروع به تبدیل این قالب به html کردم و بعد از اون میخوام به وردپرس تبدیلش کنم!

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

این آدرس قالبی که تا حدی رسوندمش

http://nicepatogh.net/test/Nicepatogh/

واینم عکس پی اس دی و قالب نهایی که میخوام در بیارم

y5g6wie70gs0xv5353hz.png

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

سوال من اینه چطوری من این عکس عنوان رو بالای این بلوک قرار بدم جوری که اون حالت مشخص باشه؟

سوال دوم در باره منوی وسط که اسمش "وسط" هسته همونطور که توی عکس هم مشخصه این عکس عنوان از سمت راست و چپ مقداری از کل بلوک بیرون زده

میخواستم ببینم این حالت رو چطوری باید ایجاد کنم؟

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

سپاس استادان عزیز

لینک به ارسال

سلام

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

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

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

البیته پیشنهادم اینه تا میتونی کم عکس استفاده کن و با css همه این کارارو کن

در مورد سوال دوم هم نفهمیدم میخوای اون بیرون زدگیا نباشه و با زیرش میزون باشه ؟

خب اگه اینه که width هرو دورو در css یه اندازه قرار بده و اگر میخوای مثل عکس باشه کم و زیاد کن خودت تاثیرش رو میبینی

در مورد تبدیل به wp هم توی انجمن جستجو کن چندین بار تاپیک زده شده

موفق باشی

لینک به ارسال

سلام

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

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

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

البیته پیشنهادم اینه تا میتونی کم عکس استفاده کن و با css همه این کارارو کن

در مورد سوال دوم هم نفهمیدم میخوای اون بیرون زدگیا نباشه و با زیرش میزون باشه ؟

خب اگه اینه که width هرو دورو در css یه اندازه قرار بده و اگر میخوای مثل عکس باشه کم و زیاد کن خودت تاثیرش رو میبینی

در مورد تبدیل به wp هم توی انجمن جستجو کن چندین بار تاپیک زده شده

موفق باشی

درود

ممنون از رهنمایی شما ولی من عکس رو جدا کردم به این صورت میگید دیگه؟

http://nicepatogh.net/test/Nicepatogh/images/title-block.png

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

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

من برای این کار margin:auto; و سایز width رو هم زیاد میکنم ولی فقط از سمت چپ بزرگ میشه و بیرون میزنه وه سمت راست به این شکل در نمیاد

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

سپاس برا کمک

لینک به ارسال

ببینید تمام جابجایی ها رو میشه با margin انجام داد. میتونید المان هایی که نیاز به جابجایی دارن رو توی مثلا یک div قرار بدید و بعد تغییر margin بدید. توجه کنید که با margin منفی هم میتونید کار کنید.

لینک به ارسال

به گفتگو بپیوندید

هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید .

مهمان
ارسال پاسخ به این موضوع ...

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   حذف قالب بندی

  تنها استفاده از 75 اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به صورت لینک

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.

×
×
  • اضافه کردن...