سورس سافت | سورس پروژه | دانلود پروژه | سورس کد

no-img

م
ن
و
سورس سافت

ادامه مطلب

آموزش
آموزش ساخت فوتر زیبا در html
امتیاز 5.00 ( 1 رای )
آموزش
مهر 25, 1395

آموزش ساخت فوتر زیبا در html


آموزش ساخت فوتر زیبا در htmlReviewed by علیرضا نجاتی on Oct 16Rating:

آموزش ساخت فوتر زیبا در html

با یکی دیگر از پست های سورس سافت از بخش آموزش طراحی وب با آموزش ساخت فوتر زیبا در html در خدمت شما دوستان هستیم. با کمک این آموزش شما به راحتی میتوانید یک فوتر زیبا و ساده در صفحه html خود بسازید، همان گونه که می دانید قسمت فوتر سایت معمولا محل قرار گیری کپی رایت و دسترسی های سریع و یا دیگر امکاناتی هست که بسته به سلیقه مدیران سایت سفارش سازی میشود. پس این آموزش طراحی وب را تا انتها دنبال کنید تا فوتر را به راحتی خودتان بسازید.

آموزش طراحی فوتر زیبا در html :

این آموزش طراحی شامل دو فایل است ابتدا فایل html و سپس فایل css هر دو کد را از سایت کپی و در یک ویرایشگر متنی مناسب کپی و با پسوند مربوطه ذخیره نمایید.

فایل index.html :

<html>
<head> <link rel=“stylesheet” type=“text/css” href=“style.css”></head>
<body>
<div class=‘contentone’></div>
<div class=‘footer’>
<div class=‘footerContent’>
مشاهده <a href=‘http://sourcesoft.ir/’>سورس سافت</a>.
</div>
</div>
</body>
</html>

فایل style.css :

*{
     margin: 0px;
     padding: 0px;
     color: #fff;
}    
body{
     width: 100%;
}    
.contentone{
     backgroundcolor: #333;
     height: 770px;
}
.footer{
     width: 100%;
     position: fixed;
     marginbottom: 0px;
     height: 80px;
     backgroundcolor: #1A1A1A;
     display: block;
}   
.footerContent{
     width: 80%;
     margin: auto;
     padding: 5px;
     textalign: center;
     borderleft: 1px solid #fff;
     borderright: 1px solid #fff;
}

نکته : جهت ویرایش کدها نیازی به استفاده از برنامه حجیم نیست، با کمک نوت پد پلاس میتونید کدها را به راحتی ویرایش کنید.

امیدوارم این آموزش طراحی وب موردپسند شما دوستان عزیز قرار گرفته باشد.

اگر سوال یا مشکلی در مورد این آموزش طراحی داشتید میتونید از بخش دیدگاه ها با ما در میان بگذارید.



درباره نویسنده

علیرضا نجاتی 61 نوشته در سورس سافت دارد . مشاهده تمام نوشته های

دیدگاه ها


پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *