فونت ها در HTML
تگ <font> نباید استفاده شود
تگ <font> در HTML 4 رایج نیست و در HTML 5 حذف شده است.
کنسرسیوم World Wide Web یا (w3c) تگ <font> را از دستوراتش حذف کرده است.
در HTML 4، باید از CSS (یا style sheetها) برای تعیین خصوصیات نمایش عناصر استفاده کرد.
مثال زیر نشان می دهد که چگونه HTML با تگ <font> کار می کند.
مثال (فونت ها در HTML)
<p>
<font size="5" face="arial" color="red">
This paragraph is in Arial, size 5, and in red text color.
</font>
</p>
<p>
<font size="3" face="verdana" color="blue">
This paragraph is in Verdana, size 3, and in blue text color.
</font>
</p>
خودتان امتحان کنید »<font size="5" face="arial" color="red">
This paragraph is in Arial, size 5, and in red text color.
</font>
</p>
<p>
<font size="3" face="verdana" color="blue">
This paragraph is in Verdana, size 3, and in blue text color.
</font>
</p>
راه درست قالب بندی - با Style ها
Set the font of text
این مثال نحوه تنظیم فونت متن را نشان می دهد.
Set the font size of text
این مثال نحوه تنظیم سایز فونت را نشان می دهد.
Set the font color of text
این مثال نحوه تنظیم رنگ متن را نشان می دهد.
Set the font, font size, and font color of text
این مثال نحوه تنظیم فونت، سایز و رنگ متن را نشان می دهد.
- نوشته شده توسط امیر پهلوان صادق
- بازدید: 61954
دیدگاه‌ها
سلام خسته نباشید
از فونت های فارسی هم میشه استفاده کرد؟
سلام، بله در CSS3 می توانید از فونت های فارسی استفاده کنید، لطفا به مطلب زیر مراجعه نمایید:
beyamooz.com/css3/653-%D9%81%D9%88%D9%86%D8%AA-%D8%AF%D8%B1-css3
سلام
آموزش فونت ها در HTML عالی بود.
سلام،
دعاي خير من تا هميشه دنبالتونه به خاطر اين مطالب مفيدتون
سوالم اينه كه اگر ما مثلا مي تونيم با تگ pre
همه ي اون چيزي رو كه مي نويسيم به همون شكل هم ببينيم چه نيازي به نوشتن اين كدها هست؟ مثلا نميشه من در word با سايز و فونت دلخواهم بنويسم و بعد در نوت پد كپي پيوست كنم؟!!! و با تگ pre به همون شكل ببينم؟! ببخشيد ديگه اگر سئوالم خيلي ابتدائيه:(
سلام
توجه داشته باشید که بدون استفاده از تگ Pre فاصله های بین حروف و Enter های بین خطوط حذف خواهد شد، یعنی تنها کاربردی که دارد حفظ کردن فاصله هاست ...! و بقیه فرمت هایی که فرمودید در Word در نظر گرفته اید مثل زخیم کردن یا Bold کردن و اندازه فونت و ... را در نظر نمی گیرد.
با سلام و تشکر.
اشتباه نکنید!!!
تگ pre عناصر داخل صفحات وب رو به صورت مجزا نشون میده و با پیش فرض خودش.
شما قصد دارید صفحات رو در مرورگر نمایش بدید، برای این منظور باید از تگهای HTML استفاده کنید. ساختار و کدنویسی رو باید بر اساس این زبان ببرید جلو. word مناسب این کار نیست.
گر چه یه مقدار سؤالتون گنگ و مبهم هست، ولی من استنباطی که کردم، این بود. اگر توضیحات بیشتری بدید، شاید بهتر بتونم راهنمایی کنم.
با سلام.شما گفتین که تگ منسوخ شده است.از چ تگی بجای آن استفاده می شود؟؟؟؟
از استفاده میشود؟؟؟
<font size="5" face="arial" color="red">
This paragraph is in Arial, size 5, and in red text color.
<
font size="5" face="arial" color="red">
This paragraph is in Arial, size 5, and in red text color.
<
font size="5" face="arial" color="red">
This paragraph is in Arial, size 5, and in red text color.
تگ در HTML 4 رایج نیست و در HTML 5 حذف شده است.
و از تگ
This paragraph is in Arial, size 5, and in red text color.
استفاده می شود
سلام
در بخش مثال نحوه تنظیم فونت متن یه کد هست کاربردشو لطفا بگید
family:verdana
تشکر
با سلام.
خیلی جاها نیاز دارید، قسمتی از متن دارای یک فونت خاص باشه، برای این منظور از این خصوصیت استفاده میکنیم. یه مثال میتونه نحوه نمایش اعداد در متن باشه. یعنی جایی که متن عدد هست، میتونید از این خصوصیت استفاده کنید و به اعداد فونت خاصی بدید و مطمئن باشید که اون اعداد با اون فونت نمایش داده میشن.
سلام خسته نباشید
تگ هایی که در نسخه های جدید HTML حدف شده اند آیا در صورت استفاده از آنها نتیجه ای در مرورگر نخواهیم دید؟
چون بنده با و مرورگر فایرفاکس 42 از تگ فونت استفاده کردم و نتیجه گرفتم.
پس منظور از حذف این تگ در نسخه 5 اچ تی ام ال چیست؟
با سلام و تشکر
معمولا تگهای منسوخ شده در مرورگرهای جدید هم قابل نمایش هستد و مشکلی در نمایش ندارن. ولی بهتره استانداردها رو رعایت کنید و از تگهای منسوخ شده استفاده نکنید.
مثلا تگ b برای بولد کردن یا تگ font و ... .
این حالات مختلف برای فونت رو میشه با استفاده از CSS پیاده سازی کرد و دیگه نیازی به تگ موردنظر نیست.
ممنون از پاسخ کامل و روشن جنابعالی
آیا ادیتوری وجود داره که بصورت آپ تو دیت بتونه قوانین W3C رو اعمال کنه و به ما اجازه استفاده از تگهای منسوخ شده رو در صورت استفاده از نسخه های جدید اچ تی ام ال نده یا پیغامی در این زمینه نمایش بده؟
ادیتور Dw واقعا کارآمد هست به نظرم، اما این موضوع رو پوشش نمیده.
راستش به این موضوع دقت نکردم.
بعد از یه مدت به مرور متوجه می‌شید تگهای منسوخ شده، کدوما هستند و خودتون می‌دونید که نباید ازشون استفاده کنید.
در مورد دریم‌ویور هم باید بگم که این ادیتور برای طراحی خوبه، ولی ادیتورهای قدرتمند‌تری هم وجود دارن که کار با اونها به مراتب خیلی ساده‌تر و بهتر از دریم‌ویور هست و امکاناتی رو در اختیار شما قرار میده که دریم‌ویور قرار نمیده.
برای مطالعه بهتره به لینک beyamooz.com/forum/threads/35-%D9%85%D8%B9%D8%B1%D9%81%DB%8C-ide-%D8%A8%D8%B1%D8%A7%DB%8C-php یه نگاهی بندازید.
موفق باشید.
سلام ....ما انواع font -familyها مثلverdona,cour ierرو از کجا میتونیم بشناسیم؟
با سلام
اگر منظور شما نوع نمایش فونت است که می توانید با امتحان کردن فونت شکل نوشتاری آن را مشاهده کنید.
با کمی جستجو در اینترنت فونت های زیادی را خواهید یافت که مطابق با سلیقتان می توانید از آنها استفاده کنید.برای استفاده از فونت های دلخواه در صفحه وب می توانید به "آموزش CSS3-فونت" از طریق لینک زیر مراجعه کنید:
http://www.beyamooz.com/css3/653-%D9%81%D9%88%D9%86%D8%AA-%D8%AF%D8%B1-css3
سلام
چرا فونت هایی که من استفاده می کنم کار نمی کنند مانند:
B Koodak Bold
Far.Dast Nevis
و ...
با سلام
به آموزش CSS3-فونت مراجعه کنید. برای این کار می توانید از لینک زیر استفاده کنید:
www.beyamooz.com/css3/653-%D9%81%D9%88%D9%86%D8%AA-%D8%AF%D8%B1-css3
ممنون راهنمایی تان
سلام
واقعا متشکرم از زحماتی که برای این سایت در جهت بالابردن علم خودم و دوستان کشیدید.
دو سوال: در اینجا وقتی مثلا می نویسیم"font size="5 ، در حقیقت واحد این 5 چیه؟ یا مثلا وقتی میگیم 110٪ این درصد و نسبت رو با چه چیزی قیاس میده و می سنجه؟
سوال بعدیم اینه که روشی هست که بفهمیم کجا باید دو نقطه بگذاریم و کجا مساوی؟ مثلا:
font size=5
font-size:200%
ضمنا من باب مثال چجوری فونت سایز اولی رو با دومی اشتباه نکنیم و بفهمیم هرکدام رو کجا استفاده کنیم؟
تشکر
سلام
توجه فرمایید، همان طور که در ابتدای مطلب بالا ذکر شده است، تگ font دیگر استفاده نمی شود و برای تنظیم فونت باید از CSS استفاده کرد. مثلاً برای تنظیم اندازه فونت از خصوصیت font-size استفاده شود.
متأسفانه با توجه به سوالتان شما دچار یک اشتباه شده اید و آن اشتباه این است که باید بجای font size بگویید size ...! با توجه به مثال زیر:<font size="5" face="arial" color="red"> ... </font>
size یکی از ویژگی های تگ font است و مثلاً تگ p چنین ویژگی ای ندارد. توجه داشته باشید تمام ویژگی ها را با علامت = مقدار دهی می کنیم. اما حالا در مثال زیر:<h1 style="font-size:200%">This is a heading</h1>
font-size یکی از خصوصیت های CSS است و ربطی به تگ h1 ندارد، یعنی در هر تگی می تواند مورد استفاده قرار بگیرد. توجه داشته باشید که تمام خصوصیت های CSS را با علامت : مقدار دهی می کنیم.
در CSS، باید واحد اعداد ذکر شود، مگر اینکه مقدار مورد نظرمان 0 باشد. لطفاً برای کسب اطلاعات بیشتر در مورد واحدهای اندازه گیری به لینک زیر مراجعه فرمایید:
www.beyamooz.com/cssref/229-css-reference/917
سلام
امکان داره راهنمایی کنید که چطوری از زبان فارسی در html استفاده کنیم؟ دقیقا چه کدی و در کدام قسمت باید بنویسیم؟
سلام
برای صفحات با محتوای فارسی، یکی از دو کار زیر را انجام دهید:
1- اضافه کردن تگ meta: در قسمت head صفحه، یک تگ meta با ویژگی های زیر اضافه نمایید. <meta http-equiv="Con tent-Type" content="text/h tml; charset=utf-8">
2- UTF-8: زمانی که می خواهید فایل HTML را در نات پد ذخیره کنید، گزینه encoding را با مقدار UTF-8 تنظیم نمایید.
سپس تصور فرمایید که یک تگ، p مانند زیر داریم، برای تکمیل کار حتماً دو خصوصیت font-family و direction را نیز باید تنظیم نمایید:<p style="font-fam ily:tahoma; direction:rtl"& gt; مطالب در بیاموز بصورت رایگان ارائه می شود </p>
البته می توان دو خصوصیت بالا را نیز بصورت زیر تنظیم نمود:body
{
font-family:tahoma;
direction:rtl
}
ببخشید من تو تایپ فارسی یه مشکلی دارم وقتی چیزی رو اشتباه مینویسم و میخوام اصلاحش کنم وقتی نوشته رو select میکنم تا درستش کنم به هم میریزه و حروف جابجا میشه؟ لطفا راهنمایی کنید مرسی
پس برای تگ html لازم نیست خصوصیت lang رو تعریف کنیم؟
حق با شماست، در ادیتورهایی مثل ++ NotePade این اتفاق می افته، و احتمالاً مجبور می شید که کل متن فارسی رو از ابتدا تایپ کنید.
در ادیتور ++ NotePade می توانید منوی View -> Text Direction RTL را انتخاب کرده و سپس متن مورد نظر را اصلاح کنید. اگر از ادیتور دیگری استفاده می کنید، به دنبال گزینه ای مشابه بالا بگردید.
سلام
من از intellij idea استفاده میکنم مشکلم حل نشد همچین گزینه ای هم که شما گفتید پیدا نکردم چیکار کنم وقتی فارسی تایپ میکنم تگها راست و چپ میشن و نوشته های فارسیم هم به هم میریزن !!خیلی ممنونم اگه راهنمایی کنید
با سلام
قبلاً از این IDE استفاده نکرده ایم.
با تشکر
با سلام دوتا سوال داشتم
اول اینکه یعنی ما از تگ font دیگه استفاده نکنیم و بجاش از css استفاده کنیم، درست فهمیدم؟؟؟
دوم اینکه تو خط زیر verdana چیه سایزه یا اسم فونته؟؟؟
<h1 style="font-fam ily:verdana"> ; This is a heading </h1>
با تشکر
سلام
1- همان طور که گفته شد، تگ font منسوخ شده است.
2- verdana اسم فونت است که البته در فارسی بیشتر از tahoma استفاده می شود. ان شا الله در ادامه با خصوصیات CSS آشنا خواهید شد، اما با استفاده از خصوصیت font-family می توان فونت متن ها را تنظیم کرد.
برای اطلاعات بیشتر در مورد font-family به لینک زیر برید:
beyamooz.com/css/85-style/91
سلام ببخشید بعدا توcssدرباره verdana ,tahomaوکلا انواع فونت هاصحبت میشه اگه نه شما اینا رو از کجا خوندین؟
بله در قسمت خصوصیات css، درباره ی انواع و اولویت فونت ها صحبت می شود به عنوان مثال می توانید به این لینک مراجعه کنید: www.beyamooz.com/cssref/227-css-properties/808-font-family
سلام ببخشید من متوجه نشدم تنظیم فونت به صورت اولیه درست است یا به صورتیکه که در مثال ها آمده
سلام، حتماً به روشی که در مثال ها آمده است.
توجه کنید که تگ font منسوخ شده است و بجای آن باید از CSS برای تنظیم فونت استفاده کرد.