سورس سافت - مرجع سورس پروژه، قالب سایت وردپرس، افزونه، اسکریپت، دوره های آنلاین و کتاب های الکترونیکی
ورود
صبر کنید ...

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

برای پخش ویدیو کلیک کنید
علیرضا نجاتی
clock icon مدت زمان مطالعه: 0 دقیقه
comment icon 1 نظرات
1395/07/25

آموزش ساخت فوتر زیبا در 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=‘https://sourcesoft.ir/’>سورس سافت</a>.
</div>
</div>
</body>
</html>

فایل style.css :

*{
     margin: 0px;
     padding: 0px;
     color: #fff;
}    
body{
     width: 100%;
}    
.contentone{
     background–color: #333;
     height: 770px;
}
.footer{
     width: 100%;
     position: fixed;
     margin–bottom: 0px;
     height: 80px;
     background–color: #1A1A1A;
     display: block;
}   
.footerContent{
     width: 80%;
     margin: auto;
     padding: 5px;
     text–align: center;
     border–left: 1px solid #fff;
     border–right: 1px solid #fff;
}

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

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

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

این مقاله چقدر برای شما مفید بود؟
0 امتیاز از 0 رای
tags
برچسب ها
آموزش html آموزش ایجاد فوتر زیبا در html آموزش ساخت فوتر آموزش طراحی فوتر آموزش طراحی فوتر زیبا در html آموزش طراحی فوتر سایت آموزش طراحی فوتردر html آموزش طراحی وب سورس سافت سورس کد html نحوه ساخت فوتر زیبا در html نحوه طراحی فوتر در html

دیدگاه و پرسش

مریم

ممنونم عالی بود