با سلام خدمت شما ، با آموزش طراحی قالب وردپرس آشنایی با html قسمت دوم در خدمت شما هستیم
خب همون طوری که درجریان هستید اینجا ما میخواهیم بهتون طراحی قالب وردپرس را بهتون یاد بدیم و.. که پیشنهاد میکنم اول قسمت قبلیو اموزش را از اینجا بخوانید
قسمت اول :
آموزش طراحی قالب وردپرس ( قسمت اول )
خب همان طور که از جلسه قبل بیاد دارید امروز قراره پیش نیازهای html و css را بگیم و اگر هم وقت کنیم کمی هم وارد وردپرس میشیم
آموزش طراحی قالب وردپرس : تگ های html
تگ html
تگ head
تگ body
تگ div
تگ p
تگ a
تگ ul
تگ li
تگ img
خب دوستان اولین تگ برای شروع طراحی قالب تگ html هستش این تگ دیگه رسما ورود شما به دنیای طراحیه 😀
و مهم ترین چیزی که باید به دونید همه ی تگ های html به صورت زیر شروع میشن
<tag name>
و با
</tag name>
تمام میشن!
با این اوصاف بریم سراغ اولین تگ طراحیمون یعنی آقای html
خب این تگ اول و اخر صفحه های که طراحی می کنین باید باشه! و به صورت دقیق تر در هر صفحه فقط یک بار این تگ داخلش نوشته میشه 😀 داخل جزوه هاتون بنویسید نکته!:))
اگه شما روی هر صفحه ای که با مرورگرتون باز می کنید راست کلیک بزنید و گزینه ی View Source را بزنید می بینید که اولین چیزی که در خط اول هستش خط <html> و اخر صفحه هم </html> این استاندارد طراحی سایته! یعنی خط اول و اخر همینه 😀 دیدین چه زود رسیدم به خط اخر؟ به همین زودی هم میرسیم به اخرین جلسه طراحیمون
الان صفحه ای که ما می خواهیم ازش شروع کنیم…
این الان صفحه کد نویسی ماست! که از برنامه note pad ++
خب این کد چون خیلی چیزی نداره واس توضیح دادن در همین حد بدونید کافیه
تگ بعدی که می خوام بهتون اموزش بدم تگ <head> هستش! این کد چیه؟ چیز خاصی نیست :))
این تگ هم مثل تگ html بیشتر صفحات دارنش و معمولا کلیات سایت و توضیحاتو داخلش قرار می گیره چون نمیدونم بگم دقیقا چیا داخلش میزارن اینجوری می گم که داخلش کد های جاوا و css داخلش معرفی میشن توضیحات مربوط به seo داخلش نوشته میشن مثل عنوان صفحه کد های گوگل انالیر و.. هر چیزی که برای کاربر مهم نیست و نمایش داده نمیشه داخل تگ هد نشون داده میشه!
یعنی الان صحفحه مون میشه:
5 تا خط نوشتیم تاحالا
تگ body دیگه شروع همه چیزه فهمیدین؟ شروع همه چیزه هر تگی که دیگه از اینجا به بعد می گیم داخل همین تگ body قرارش میدید 😀
سه تا تگ اصلی را گفتم این اصول کار یا همون الفبا مونه بقیه تگ ها رو دیه اینجوری توضیح نمی دم چون می خواییم زود بریم سر اصل مطلب!
تگ <div> تقریبا هر صفحه ای که شما میبینید شاید بالغ بر 100 تا از این کد استفاده شده باشه پس خوب روی این تگ مانور بدین
تگ <p> که مربوط به متن ها و نوشته هاتونه و معمولا برای پاراگراف ها استفاده میشه
تگ <a> برای لینک ها هستش!
تگ <img> برای عکس ها!
تگ بعدی ul و li این دوتا تگ معمولا با هم استفاده میشن و تگ li داخل ul هستش! معمولا ها! و اصلا بعضی جاها هم اصلا داخل ul قرار نمیگیره و خودش تنهایی کار میکنه 🙂
تگ ul معمولا برای ساخت باکس ها و جعبه هایی که داخلشون چند تا لیست هستش استفاده میشه. به نمونه های زیر توجه کنید
الان این موارد بالا اگه توجه کنید همه شون داخل یه مستطیل بزرگ هستن که به اون مستطیل بزرگه تگ ul می گن البته الزاما نیازی نیست که از تگ ul استفاده کنید و می تونید باز هم از تگ div استفاده کنیم! اما این تگ ul یه سری کدهای css پیش فرض داره که خیلی کمک میکنه و نیازی نیست دوباره برای css بنویسیدشون!
تگ li هم همون مواردی هستن که داخلش نوشته شده فکر کنم منظورمو گرفتید چی می گم! 😀
به پایان این اموزش رسیدیم html هم تقریبا تموم شد و یاد اوری های لازم و را کردیم! همان طور هم که در جلسه قبلی گفتم html و css را خیلی کامل نمی گیم تا به اصل موضوع برسیم و فقط به اصل کار توجه می کنیم.!
موفق باشید و امیدوارم توضیحاتی که دادیم مفید باشه!
Visitor Rating: 5 Stars
Visitor Rating: 5 Stars
Visitor Rating: 5 Stars
Visitor Rating: 5 Stars
Visitor Rating: 5 Stars
Visitor Rating: 5 Stars
Visitor Rating: 5 Stars