بک لینک

اولین قالب ساده من
#1
سلام دوستان،
اینم اولین قالبی که ساختم!
لطفا به این سوالای منم جواب بدید:

1- تگ <br> و <hr> و <img> چطوری بسته میشن؟

2- اون باکس ها رو (درباره من و...) رو درست گذاشتم؟چون وقتی پدینگ دادم به متن که یکم فاصله بگیره از کناره ها ، اون باکس هم پدینگ میخورد!

3- در ضمن اگه تگ اشتباهی به کار بردم و یا منسوخ شده بود ، بهم بگید،

4- راستی استایلم رو هم نگاه بندازین ، چطوریه!

5- نرم افزاری بهتر از دریم ور سراغ ندارین؟ که خودش تب بندی ها رو رعایت کنه!

6- این -moz- و .. اینا چیه اول تگ ها میزارن؟ضروریه؟چی هستن اصلا؟


این کد html قالب :
کد:
<!doctype html>
<html dir="rtl">
<head>
<meta charset="utf-8">
<title>اولین قالب ساده من</title>
<link rel="stylesheet" type="text/css" href="style.css" >
<link rel="stylesheet" type="text/css" href="http://www.fontonline.ir/css/BYekan.css">
</head>
<body>
<div class="content">
<header>اولین قالب ساده من</header>
<div class="sidebar">
<div class="sidebar-title">
منو میشناسی؟
</div>
درپشت چهار چرخه فرسوده ای
کسی خطی نوشته بود:
(( من گشتم نبود ٬ تودیگر نگرد ، نیست))
گرخسته ای بمان و اگر خواستی بدان:
ما را تمام لذت هستی به جستجوست.
پویندگی ،تمامی معنای زندگیست.
هرگز(( نگرد نیست )) ؛ سزاوار مرد نیست!<br>
------------------------
<br>من الیاس بشکنی هستم و تازه دارم کدنویسی رو یاد میگیرم<br>
------------------------
<br>ایمیل من : e.b35927@gmail.com
</div>
<div class="txt">
<div class="txt-title">
کمی درباره من. . . 
</div>
سلام دوستان | خوبین؟<br>
من تازه کدنویسی رو شروع کردم و با کد ها آشنا نیستم و همین طوری هر کدی گیرم بیاد میزارم :)<br><br>
-----------------------------------------<br><br>
در ضمن این قالب هم برای هیچ سرویسی نیست ، فقط html خالیه!<br>
ممنون میشم تمام مشکلاتشو بگید و یا اگه میتونید کمک کنید که من میخوام حرفه ای بشم ، یکی مثل شما :)<br><br>
<a href="#"><div class="butt">
ادامه مطلب
</div></a>
</div>
<div class="footer">
هیچ حقوقی محفوظ نیست،اما خدا به انسان درک و فهم عطا کرده تا گمراه نشود!</div>
</div>
</body>
</html>
اینم استایل قالب :
کد:
@charset "utf-8";
/* CSS Document */
body{
    background-color:#cccccc;
}
.content{
    width:1000px;
    text-align:center;
    margin:0 auto;
}
header{
    background-color:#0099cc;
    font-family:BYekan;
    font-size:60px;
    font-weight:bold;
    line-height:130px;
    border:2px solid #FFF;
    border-radius:10px;
    color:#FFF;
    width:800px;
    height:150px;
    margin:0 auto;
    margin-top:10px;
}
.sidebar{
    background-color:#FFF;
    width:280px;
    height:450px;
    font-family:BYekan;
    font-size:20px;
    text-align:right;
    border:2px solid #FFF;
    border-radius:10px;
    float:right;
    margin-top:20px;
    margin-right:100px;    
}
.sidebar-title{
    background-color:#0099cc;
    width:280px;
    height:70px;
    font-family:BYekan;
    font-size:30px;
    font-weight:bold;
    text-align:center;
    color:#FFF;
    line-height:65px;
    border:2px solid #FFF;
    border-radius:10px;
    float:right;
    margin-top:-3px;
    margin-right:-2px;
}
.txt{
    background-color:#FFF;
    width:480px;
    height:450px;
    font-family:BYekan;
    font-size:20px;
    text-align:right;
    border:2px solid #FFF;
    border-radius:10px;
    float:left;
    margin-top:20px;
    margin-left:100px;
    
}
.txt-title{
    background-color:#0099cc;
    width:480px;
    height:70px;
    font-family:BYekan;
    font-size:30px;
    font-weight:bold;
    text-align:center;
    color:#FFF;
    line-height:65px;
    border:2px solid #FFF;
    border-radius:10px;
    float:left;
    margin-top:-3px;
    margin-left:-2px;
}
a{
    text-decoration:none;
}
.butt{
    width:150px;
    height:50px;
    border:5px solid #0099cc;
    border-radius:15px;
    transition:.3s all;
    text-align:center;
    line-height:48px;
    font-size:28px;
    color:#000;
    float:left;
    margin-left:30px;
    opacity:.7;
}
.butt:hover{
    background-color:#0099cc;
    color:#FFF;
    transition:.3s;
    opacity:1;
}
.footer{
    width:800px;
    height:50px;
    background-color:#0099cc;
    border:2px solid #FFF;
    border-radius:10px;
    margin-top:490px;
    margin-right:95px;
    text-align:center;
    font-family:BYekan;
    font-size:20px;
    color:#FFF;
    line-height:50px;
}
پاسخ
#2
داداش فوق العاده بود!بخدا خیلی قشنگ بود.یه همچین قالبی ولی کمی پیشرفته تر و همراه با منو ناوبری مثل صحیفه، خیلی سخته طراحی و کدنویسیش؟برای وردپرس

همین الان دانلود کنید!











پاسخ
 سپاس شده توسط E-Beshkani
#3
(94-2-29، 09:00 صبح)مهدی کفشگر نوشته است: داداش فوق العاده بود!بخدا خیلی قشنگ بود.یه همچین قالبی ولی کمی پیشرفته تر و همراه با منو ناوبری مثل صحیفه، خیلی سخته طراحی و کدنویسیش؟برای وردپرس
خیلی ممنون53
آره چون بدون عکسه ، یکم قشنگه
البته ظاهرش هم اونقدر هم قشنگنیست ولی باطنش (کدهاش) معلوم نیست خوب هست یانه؟(شایدم افتضاح باشه)Smile
برای من که هنوز تازه فقط چند تا تگ css یاد دارم سخته منو طراحی کنم
وزردپرس رو که فعلا بیخیال شید،توابعش سخته
من اگه خیلی زور بزنم شاید فعلا برای بلاگفا بتونم ، فقط(اگه بشه چی میشه) 4
پاسخ
#4
(94-2-29، 09:37 صبح)E-Beshkani نوشته است:
(94-2-29، 09:00 صبح)مهدی کفشگر نوشته است: داداش فوق العاده بود!بخدا خیلی قشنگ بود.یه همچین قالبی ولی کمی پیشرفته تر و همراه با منو ناوبری مثل صحیفه، خیلی سخته طراحی و کدنویسیش؟برای وردپرس
خیلی ممنون53
آره چون بدون عکسه ، یکم قشنگه
البته ظاهرش هم اونقدر هم قشنگنیست ولی باطنش (کدهاش) معلوم نیست خوب هست یانه؟(شایدم افتضاح باشه)Smile
برای من که هنوز تازه فقط چند تا تگ css یاد دارم سخته منو طراحی کنم
وزردپرس رو که فعلا بیخیال شید،توابعش سخته
من اگه خیلی زور بزنم شاید فعلا برای بلاگفا بتونم ، فقط(اگه بشه چی میشه) 4
انشالله که میشه چرا که نه؟103
منم که دارم برنامه نویسی با Basic4android رو یاد میگیرم.کلا هرکسی مشغول به یادگرفتن چیزیه.موفق باشی الیاس جان.

همین الان دانلود کنید!











پاسخ
 سپاس شده توسط E-Beshkani
#5
سلام

1 - این تگ ها نیازی به بستن ندارند ؛ جزء تگ های استثنایی هستن!!!
2 - باکس خوبه ! ولی عنوان باکس ؛ باید از تگ های هدینگ استفاده کنی (h1,h2,h3,h4,h5,h6)
height هم فقط در مواردی که میدونی اندازه اش بیشتر نمیشه یه مقدار بهش بده! (بلوک های تبلیغاتی و ...)
چون اگه اندازه ثابت بذاری مسه سایدبارت متن میزنه بیرون.
3 - برای نوشتن متن از <p> استفاده کن
برنامه که تو پیچم بود ، مگه خوب نیس! البته هر چند دیزاینری نیس! یعنی اماده نداره (مسه دریم ویور نیس).
البته ویژگی های خیلی خاضی داره!سعی کنید از برنامه که فقط کدنویسی دارن استفاده کنی (نوت پد پلاس و ساب لایم تکست)
-moz- پیشوند مرورگر موزیلا هستش ، یه سری استایلا هست که تو مرورگرها کاملا نیسن! باید این پیشوند رو بذاری وگر نه کار نمیکنه!
برا کروم  -webkit-
برا اپرا -o-
برا اکسپلورر -ms-
پاسخ
 سپاس شده توسط E-Beshkani
#6
باسلام.
خوبه!
فقط چرا اینقدر فونت هارا بزرگ می کنید؟
یکم نظم به کد ها بدید.
اگرهمین شکل پیش برید دیگه تا اواخر تابستون رودست همه بلند میشید1
یاعلی

تگ های <br> و <hr>  احتیاج به بسته شدن ندارند..
اما ببندید هم مشکلی نداره..
برای تصویر هم <"img src="tasvireshoma.gif">
یاعلی
پاسخ
 سپاس شده توسط E-Beshkani
#7
(94-2-29، 10:22 صبح)jamo نوشته است: سلام

1 - این تگ ها نیازی به بستن ندارند ؛ جزء تگ های استثنایی هستن!!!
کدومش درست تره؟ <img  />    <img>

-moz- پیشوند مرورگر موزیلا هستش ، یه سری استایلا هست که تو مرورگرها کاملا نیسن! باید این پیشوند رو بذاری وگر نه کار نمیکنه!
برا کروم  -webkit-
برا اپرا -o-
برا اکسپلورر -ms-
چه تگ هایی ؟ زیادن؟

(94-2-29، 10:22 صبح)jamo نوشته است: برنامه که تو پیچم بود ، مگه خوب نیس! البته هر چند دیزاینری نیس! یعنی اماده نداره (مسه دریم ویور نیس).
البته ویژگی های خیلی خاضی داره!سعی کنید از برنامه که فقط کدنویسی دارن استفاده کنی (نوت پد پلاس و ساب لایم تکست)

چون هنوز کامل کد ها رو یاد ندارم بنویسم ، ممکنه غلط املایی پیش بیاد!

میخوام مثل این دریم ور خودش بقیه کدو رو کامل کنه

ولی این دریم ور تب بندی رو رعایت نمیکنه که!(باید خودم تب بندی کنم؟)
پاسخ
#8
(94-2-29، 10:22 صبح)torbat نوشته است: باسلام.
خوبه!
فقط چرا اینقدر فونت هارا بزرگ می کنید؟
یکم نظم به کد ها بدید.
اگرهمین شکل پیش برید دیگه تا اواخر تابستون رودست همه بلند میشید1
یاعلی

تگ های <br> و <hr>  احتیاج به بسته شدن ندارند..
اما ببندید هم مشکلی نداره..
برای تصویر هم <"img src="tasvireshoma.gif">
یاعلی
چ جوری ببندیم ؟
<تگ بازشده></تگ بسته شد>
حالا عکس رو چ جوری؟

(94-2-29، 10:27 صبح)E-Beshkani نوشته است:
(94-2-29، 10:22 صبح)jamo نوشته است: سلام

1 - این تگ ها نیازی به بستن ندارند ؛ جزء تگ های استثنایی هستن!!!
کدومش درست تره؟ <img  />    <img>

-moz- پیشوند مرورگر موزیلا هستش ، یه سری استایلا هست که تو مرورگرها کاملا نیسن! باید این پیشوند رو بذاری وگر نه کار نمیکنه!
برا کروم  -webkit-
برا اپرا -o-
برا اکسپلورر -ms-
چه تگ هایی ؟ زیادن؟

(94-2-29، 10:22 صبح)jamo نوشته است: برنامه که تو پیچم بود ، مگه خوب نیس! البته هر چند دیزاینری نیس! یعنی اماده نداره (مسه دریم ویور نیس).
البته ویژگی های خیلی خاضی داره!سعی کنید از برنامه که فقط کدنویسی دارن استفاده کنی (نوت پد پلاس و ساب لایم تکست)

چون هنوز کامل کد ها رو یاد ندارم بنویسم ، ممکنه غلط املایی پیش بیاد!

میخوام مثل این دریم ور خودش بقیه کدو رو کامل کنه

ولی این دریم ور تب بندی رو رعایت نمیکنه که!(باید خودم تب بندی کنم؟)
<img src="" alt="" >
injori ham koni eshkaal nadareh
<img src="" alt="" />
..............................................
با آپدیت مرورگرها بعضی از این استایل ها نیاز به پیشوند ندارند (css3)
پاسخ
 سپاس شده توسط E-Beshkani
#9
یه سوال!

نوت پد ++ هم مثل دیم ور کد هارو خودش کامل میکنه یا نه؟
پاسخ
#10
(94-2-29، 10:59 صبح)E-Beshkani نوشته است: یه سوال!

نوت پد ++ هم مثل دیم ور کد هارو خودش کامل میکنه یا نه؟
نه ، ولی پلاگین های زیادی داره شاید باشه ! ، خیلی کاربر داره !!!!
1coder.blog.ir/page/app
لینکش اینجا هست 6MB
پاسخ
 سپاس شده توسط E-Beshkani


پرش به انجمن:


کاربرانِ درحال بازدید از این موضوع: 1 مهمان