جلسه نهم آموزش html – تگ span

آموزش اچ تی ام ال
۱۹ دی
0

این جلسه آموزشی آنزیم خیلی کوتاهه
در این جلسه به شما تگ span رو آموزش میدیم.
تگ span در واقع تکه ای از متن رو نشونه گذاری میکنه. (همانند تگ div که در جلسه ی بعد در باره تگ div صحبت میکنیم). نشونه گذاری متنها چه کاربردی داره؟
کاربردش در این هست که شما میتونین به اون تکه متنی که نشونه گذاری کردین و یا به عبارتی با تگ span مشخص کردینش استایل خاصی بدین.مثلا اون متن رو bold کنین و یا فونتش رو تغییر بدین.
در اینجا توضیح بیشتری نمیدم. چون باعث سردرگمی شما میشه.. در کلاسهای بعدی با استفاده از تگ span و div کارهای فوق العاده ای رو انجام خواهیم داد.
به مثال زیر توجه کنین که یک نمونه ی ساده از تگ span هست.

<!DOCTYPE html>
<html>
<head>
<title>جلسه نهم آموزش اچ تی ام ال آنزیم - تگ اسپن</title>
</head>
<body>
<span>این یک متن ساده در یک تگ ساده ی اسپن است</span> این یک متن ساده بدون اسپن است.
</body>
</html>

توجه کنین که تگ span به تنهایی هیچ تاثیر ظاهری روی متن شما نخواهد گذاشت!
فایل این جلسه رو در زیر میتونین دانلود کنین

جلسه ششم آموزش html – سایزبندی خطوط افقی

آموزش اچ تی ام ال
۰۹ دی
0

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

در این جلسه با خاصیت size میخوایم به این خطوط سایز هم بدیم که چند پیکسل باشن

به کدهای زیر توجه کنین:

<!DOCTYPE html>
<html>
<head>
<title>جلسه ششم آموزش اچ تی ام ال آنزیم - سایزبندی خطوط افقی</title>
</head>
<body>
خط اول
<hr size="10px" color="red">
خط دوم
<hr size="30px" color="green">
خط سوم
<hr color="blue">
</body>
</html>

میبینین که در داخل تگ hr  ما از کلمه ی size استفاده کردیم تا به html بفهمونیم که خط مورد نظر رو به تعداد پیکسلی که وارد کردیم نشون بده. توجه کنین که عددهایی که جلوش px نوشته شده سایزمونه… با تغییر دادنش میتونین سایز (منظورمون از سایز خطوط افقی همون ضخامتشه)رو تغییر بدین. و یادآوری میکنم که حتما این اعداد با px  روبروشون باید داخل دابل کوتیشن یعنی ” ” قرار بگیرن.
میتونین کدهای آماده رو از فایل زیر دانلود کنین تا ببینین سایز خطوط چطور تغییر کرده.

جلسه پنجم آموزش html – رنگ بندی خطوط افقی

آموزش اچ تی ام ال
۰۶ دی
0

با عرض سلام

با جلسه پنجم آموزش html در سایت آنزیم در خدمتتون هستیم…

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

در این جلسه به شما آموزش میدم که چطور رنگ های مختلفی برای این خطوط افقی در نظر بگیرین

برای این کار باید داخل کد <hr> عبارت “نام رنگ انتخابی”=color  را وارد کنین و در قسمت رنگ انتخابی باید نام رنگ به زبان انگلیسی را وارد کنیم. البته ناگفته نماند که فعلا از نام رنگ استفاده میکنیم و بعدا از کدهای مربوط به طیف های رنگی (مطابق استانداردهای جهانی) استفاده خواهیم کرد.

کد زیر رو در یک نوت پد وارد کنین و به عنوان یک سند html (همانطور که در جلسه اول گفته شد) ذخیره کنین تا شاهد نتیجه باشین

<!DOCTYPE html>
<html>
<head>
<title>جلسه پنجم آموزش اچ تی ام ال آنزیم - رنگ بندی خطوط افقی</title>
</head>
<body>
خط اول
<hr color="red">
خط دوم
<hr color="green">
خط سوم
<hr color="blue">
</body>
</html>

جهت دریافت فایل آماده این تمرین از باکس زیر میتونید استفاده کنید: