سایت خود را بسازید ، به روش saalek110

saalek110

saalek110

Well-Known Member
کادر دور صفحه:

اوایل صفحه اضافه کنید:
PHP: 
 echo"<div id='kadr'>";

آخرهای صفحه هم این را اضافه کنید:
PHP: 
echo"</div>";

در بین <head> و </head> باید <style> و </style> بسته بزارید..و مشخصات کادر را درونش بنویسید:
CSS: 
<head>
<style>

#kadr
{
border:7px solid #8877cc;

 
 padding-top: 40px;
 padding-bottom: 150px;
 padding-left: 15px;
  padding-right: 15px;


 margin-top: 15px;
 margin-right: 8px;
 margin-left:  8px;
 margin-bottom: 40px;


}


</style>
</head>

اعداد فاصله را با سلیقه خود کم و زیاد کنید.
 
آخرین ویرایش:
saalek110

saalek110

Well-Known Member
چگونگی استفاده از css :

در سایتها این جوری استفاده میشه:
HTML: 
.....
<head>
<title>title of website</title>
<link rel="stylesheet" href="css/my_css.css">
....
.....

یعنی یک فایل css داریم که داخل head آدرسش را می دهیم.
سورس سایتها را که بگیرید همین را می بینید... در ویندوز کلیک راست و سورس را می زنید ، در گوشی view-source را نوشته و دو نقطه گذاشته و اسم سایت را می نویسید.

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

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

بعدا روش اینکلود کردن فایل css را میگم ، فعلا خواستم دلیل استفاده از این روش را بگم
 
آخرین ویرایش:
saalek110

saalek110

Well-Known Member
عکس بک گراند:
CSS: 
body {
  background-image: url("paper.gif");
}
تکرار:
CSS: 
background-repeat: repeat-x;
بدون تکرار:
CSS: 
background-repeat: no-repeat;
گاهی عکس کوچک است و با تکرار می تونه موشش بدهد.
محل عکس:
CSS: 
background-position: right top;
CSS: 
background-attachment: fixed;
CSS: 
background-attachment: scroll
 
آخرین ویرایش:
saalek110

saalek110

Well-Known Member
ساخت یک قسمت با ابعاد خاص:
CSS: 
div {
  height: 200px;
  width: 50%;
  background-color: powderblue;
}
 
آخرین ویرایش:
saalek110

saalek110

Well-Known Member
Table css:

CSS: 
table {
  width: 100%;
}

CSS: 
th {
  height: 70px;
}
CSS: 
td {
  text-align: center;

th {
  text-align: left;
}
}

CSS: 
td {
  height: 50px;
  vertical-align: bottom;
}

CSS: 
th, td {
  padding: 15px;
  text-align: left;
}

CSS: 
th {
  background-color: #04AA6D;
  color: white;
}
 
آخرین ویرایش:
saalek110

saalek110

Well-Known Member
در شکل زیر در موقع خوندن جدول پست ها از دیتابیس من دو تا tr قرار دادم. یکی برای نام پست زن و دیگری برای خود پست.:
PHP: 
<table>
while(......)
{

<tr>
<td>Esme postzan</td>
</tr>


<tr>
<td>
date
post
</td>
</tr>



}
</table>
توجه کنید که تگ های table دو طرف حلقه while قرار می گیرد.
اینکه while چیه ، می دونید که بعد نوشتن کوئری خوندن دیتابیس یک خط result داریم که کوئری را توسط متغیر کانکشن اجرا می کند و بعدش این while می آید برای چاپ. کد بالا چگونگی استفاده از table در html است برای چاپ جدول دیتابیس.

و ناریخ را کنار پست قرار دادم و دیگه ردیف tr برایش نداشتم، چون نمی خواستم هر پست ۳ ردیفه چاپ شود. قبلا ۳ ردیفه با سه رنگ کارکردم جالب نشد.
و تاریخ ، فونتش با فونت محتوای پست یکی بود و به آن چسبیده بود و جالب نبود.
بنابراین یک div تعریف کردم و تاریخ را داخل div گذاشتم و صفاتی برای تاریخ تعیین کردم.

قبلا در صفحه ۲ تاپیک روش div تعریف کردن را گفتم:
CSS: 
 echo'<div id="date">';
     echo date("Y-m-d H:i:s", $post_time);
  echo'</div>';

و بالای صفحه بین تگهای style بین تگهای head می نویسیم:
CSS: 
  #date {
....
....
...
...
}
 

پیوست ها

  • Screenshot_۲۰۲۴-۰۲-۰۱_۰۹۳۰۰۸.jpg
    Screenshot_۲۰۲۴-۰۲-۰۱_۰۹۳۰۰۸.jpg
    65.8 کیلوبایت · بازدیدها: 1
آخرین ویرایش:
برای ارسال پاسخ شما باید وارد سیستم شوید.

آخرین مطالب مجیدآنلاین

جدیدترین ارسال ها

بالا