مشاوره رایگان
دریافت لینک های دانلود
دریافت پستی درب منزل
مبلغ کل:
تومان
جهت دریافت کد تخفیف به کانال تلگرام مراجعه و یا با پشتیبان آنلاین هماهنگ نمایید
بررسی تگ های Phrase در HTML برای فرمت دهی به متن ها
تگ های phrase
تگ های phrase برای اهداف خاص طراحی شده اند، این تگ ها به گونه ای مشابه سایر تگ های اصلی مانند <b>، <i>، <pre> و <tt> نمایش داده می شوند. در این آموزش شما را با مهم ترین تگ های phrase آشنا می کنیم، پس بگذارید آنها را یک به یک ببینیم.
متن برجسته (Emphasized Text)
هر چیزی که در عنصر <em> ... </ em> قرار بگیرد، به عنوان متن تأکید شده نمایش داده می شود.
مثال :
<!DOCTYPE html>
<html>
<head>
<title>Emphasized Text Example</title>
</head>
<body>
<p>The following word uses an <em>emphasized</em> typeface.</p>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
متن مارک دار شده (Marked Text)
هر چیزی که در عنصر <mark> ... </ mark> قرار بگیرد، با جوهر زرد مشخص شده نمایش داده می شود.
<!DOCTYPE html>
<html>
<head>
<title>Marked Text Example</title>
</head>
<body>
<p>The following word has been <mark>marked</mark> with yellow</p>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
متن قوی (Strong Text)
هر چیزی که در عنصر <strong> ... </ strong> قرار بگیرد، به عنوان متن مهم نمایش داده می شود.
مثال :
<!DOCTYPE html>
<html>
<head>
<title>Strong Text Example</title>
</head>
<body>
<p>The following word uses a <strong>strong</strong> typeface.</p>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
اختصار متن (Text Abbreviation)
شما می توانید یک متن را با قرار دادن آن در داخل تگ باز <abbr> و تگ بسته </ abbr> مخفف کنید. در مثال زیر Abhy مخفف Abhishek می باشد.
<!DOCTYPE html>
<html>
<head>
<title>Text Abbreviation</title>
</head>
<body>
<p>My best friend's name is <abbr title = "Abhishek">Abhy</abbr>.</p>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
عنصر اختصار (Acronym Element)
عنصر <acronym> به شما نشان می دهد که متن بین تگ های <acronym> و </ acronym> مخفف است. در حال حاضر عمده مرورگرها، ظاهر محتوای عنصر <acronym> را تغییر نمی دهند.
مثال :
<!DOCTYPE html>
<html>
<head>
<title>Acronym Example</title>
</head>
<body>
<p>This chapter covers marking up text in <acronym title="world wide web">www</acronym>.</p>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
جهت متن (Text Direction)
عنصر <bdo> ... </ bdo> مخفف Bi-Directional Override است و به معنای نادیده گرفتن جهت متن فعلی می باشد.
مثال :
<!DOCTYPE html>
<html>
<head>
<title>Text Direction Example</title>
</head>
<body>
<p>This text will go left to right.</p>
<p><bdo dir = "rtl">This text will go right to left.</bdo></p>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
عبارت ویژه (Special Terms)
عنصر <dfn> ... </ dfn> (یا HTML Definition Element) به شما اجازه می دهد که یک عبارت خاص را معرفی می کنید.
استفاده از عنصر <dfn> مشابه کلمات italic در میان پاراگراف است.
به طور معمول، وقتی از عنصر <dfn> استفاده می کنید که قصد داشته باشید یک اصطلاح کلیدی را معرفی کنید. امروزه در اکثر مرورگرها ، محتوای یک عنصر <dfn> به صورت یک فونت italic نمایش داده می شود.
<!DOCTYPE html>
<html>
<head>
<title>Special Terms Example</title>
</head>
<body>
<p>The following word is a <dfn>special</dfn> term.</p>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
متن نقل قول (Quoting Text)
وقتی می خواهید متن نقل قولی را از یک منبع دیگر بیان کنید، شما باید آن را در بین تگ <blockquote> ... </ blockquote> قرار دهید.
متن داخل عنصر <blockquote> معمولا از لبه های چپ و راست متن فاصله می گیرد و گاهی اوقات با استفاده از یک فونت italic نمایش داده می شود.
<!DOCTYPE html>
<html>
<head>
<title>Blockquote Example</title>
</head>
<body>
<p>The following description of XHTML is taken from the W3C Web site:</p>
<blockquote>XHTML 1.0 is the W3C's first Recommendation for XHTML,following on
from earlier work on HTML 4.01, HTML 4.0, HTML 3.2 and HTML 2.0.</blockquote>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
نقل قول های کوتاه (Short Quotations)
در نقل قول های کوتاه، هنگامی که شما می خواهید یک نقل قول دوگانه را در یک جمله اضافه کنید، باید از عنصر <q> ... </ q> استفاده کنید.
مثال :
<!DOCTYPE html>
<html>
<head>
<title>Double Quote Example</title>
</head>
<body>
<p>Amit is in Spain, <q>I think I am wrong</q>.</p>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
تگ cite در HTML
این تگ عنوان یک اثر مانند کتاب، مقاله، آهنگ، فیلم و ... و یا نویسنده یک کتاب یا یک آدرس url را بیان می کند. شما می توانید منبع یک اثر را بین تگ باز <cite> و تگ بسته </ cite> قرار دهید.
متنی که در تگ <cite> قرار می گیرد، بصورت italic نوشته می شود.
<!DOCTYPE html>
<html>
<head>
<title>Citations Example</title>
</head>
<body>
<p>This HTML tutorial is derived from <cite>W3 Standard for HTML</cite>.</p>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
کدهای کامپیوتر (Computer Code)
هر کدام از کدهای برنامه نویسی که در صفحه وب نمایش داده می شود باید در داخل تگ های <code> ... </ code> قرار گیرند.
معمولا محتوای عنصر <code> به صورت یک فونت monospaced است. همانند کدهایی که در اکثر کتاب های برنامه نویسی مشاهده می کنید.
مثال :
<!DOCTYPE html>
<html>
<head>
<title>Computer Code Example</title>
</head>
<body>
<p>Regular text. <code>This is code.</code> Regular text.</p>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
متن صفحه کلید (Keyboard Text)
وقتی درباره کامپیوتر صحبت می کنید، اگر میخواهید به خواننده بگویید تا متنی را وارد کند، می توانید از عنصر <kbd> ... </ kbd> برای نشان دادن آنچه که باید وارد کند، استفاده نمایید که به صورت فونت monospace نمایش داده می شود. همانطور که در این مثال نشان داده شده است. استفاده از این تگ توصیه نمی شود ولی برای نتایج بهتر می توانید از CSS نیز استفاده نمایید.
مثال :
<!DOCTYPE html>
<html>
<head>
<title>Keyboard Text Example</title>
</head>
<body>
<p>Regular text. <kbd>This is inside kbd element</kbd> Regular text.</p>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
خروجی برنامه (Program Output)
عنصر <samp> ... </ samp> نمونه خروجی را از یک برنامه و اسکریپت و ... نشان می دهد.
از این تگ، هنگام مستند سازی برنامه نویسی و یا مفاهیم برنامه نویسی استفاده می شود.
مثال :
<!DOCTYPE html>
<html>
<head>
<title>Program Output Example</title>
</head>
<body>
<p>Result produced by the program is <samp>Hello World!</samp></p>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
متن آدرس (Address Text)
از عنصر <address> ... </ address> برای نمایش هر آدرسی استفاده می شود.
مثال :
<!DOCTYPE html>
<html>
<head>
<title>Address Example</title>
</head>
<body>
<address>388A, Road No 22, Jubilee Hills - Hyderabad</address>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
فصلِ:
5
,
تعداد قسمت ها:
177
,
سطح:
صفر تا صد
موضوعات:
آموزش HTML
آموزش HTML5
این فصل در یک نگاه:
در این فصل صفحات قالب فروشگاهی را بطور کامل واکنشگرا می کنیم.…
HTML مخفف عبارت Hypertext Markup Language است. این زبان در واقع یک نوع زبان نشانه‌گذاری استاندارد برای ایجاد صفحات وب و وب اپلیکیشن‌ها محسوب می‌شود. در واقع HTML را عنصر کلیدی صفحات وب می…
فصلِ:
3
,
تعداد قسمت ها:
25
,
سطح:
صفر تا صد
این فصل در یک نگاه:
فصل سوم…
آموزش طراحی ریسپانسیو مدرن و جذابتر نسبت به بوتسرپ (همراه با ساخت صفحه اصلی و پنل یک آژانس مسافربری) آموزش پروژه محور فریمورک متریالایز برای اولین بار بین وب سایت های آموزشی آموزش تمامی …
فصلِ:
5
,
تعداد قسمت ها:
77
,
سطح:
متوسط
این فصل در یک نگاه:
ساخت منوی مدیریت سایت،ایجاد بخش دسته بندی ها ، جدول نمایش دسته ها و ایجاد دسته جدید،ایجاد بخش ویژگی های یک دسته،ایجاد وی…
این مجموعه با تلفیقی از فریمورک bootstrap و کد های html و css ارائه گردیده و پیش نیاز این آموزش ، دوره دیجی کالای آقای مهندس بلاغی است چون این پروژه در قالب mvc پیاده گردیده و با توجه به ا…
فصلِ:
11
,
تعداد قسمت ها:
162
,
سطح:
صفر تا صد
این فصل در یک نگاه:
در این فصل(فصل یازدهم مجموعه)،به طراحی CMS (سیستم مدیریت محتوا)اختصاصی فروشگاه می پردازیم.هدف از طراحی این بخش،آنست که م…
در این مجموعه آموزشی قصد داریم از صفر تا صد طراحی یک فروشگاه اینترنتی رو به صورت کامل آموزش بدهیم.این فروشگاه شامل تمامی بخش های مورد نیاز یک فروشگاه اینترنتی است. هدف از این مجموعه،آموزش…
فصلِ:
4
,
تعداد قسمت ها:
240
,
سطح:
صفر تا صد
موضوعات:
آموزش PHP
آموزش Bootstrap
آموزش CSS
آموزش JQUERY
آموزش HTML
آموزش PHP MVC
آموزش Ajax
آموزش HTML5
این فصل در یک نگاه:
طراحی پنل مدیریت(دسته بندی)- دسته بندی یا category - نمایش دسته های فرعی در view با ورود به یکی از دسته های اصلی و آشن…
توضیحات کلی مجموعه: این مجموعه توسط فریمورک محبوب و دوست داشتنی bootstrap و به صورت تضمینی و صفر تا صد جهت یادگیری کارآموزان عزیز ارائه گردیده و دوستانی که این دوره را به طور کامل و دقیق…
فصلِ:
4
,
تعداد قسمت ها:
368
,
سطح:
صفر تا صد
موضوعات:
آموزش HTML5
آموزش CSS
آموزش JAVASCRIPT
آموزش PHP
آموزش PHP MVC
آموزش Ajax
آموزش HTML
آموزش ساخت فروشگاه اینترنتی
آموزش Bootstrap
آموزش Laravel
این فصل در یک نگاه:
مباحث تکمیلی فریم ورک لاراول…
فصل اول :آموزش مقدماتی فریم ورک لاراول معرفی فریم ورک لاراول و پیشنیازهای انجام کار انجام کانفیگ های اولیه برای نصب و راه اندازی فریم ورک معرفی روش های نصب پروژه لاراولی از طریق سایت گی…
فصلِ:
1
,
تعداد قسمت ها:
155
,
سطح:
صفر تا صد
موضوعات:
آموزش HTML5
آموزش CSS
آموزش JAVASCRIPT
آموزش JQUERY
آموزش PHP
آموزش PHP MVC
آموزش Ajax
آموزش HTML
آموزش NodeJs
آموزش Bootstrap
آموزش Laravel
آموزش Symphony
این فصل در یک نگاه:
مباحث مقدماتی فریم ورک react.js…
توضیحات کلی مجموعه: فصل اول : آشنایی با مباحث مقدماتی فریم ورک react.js نصب و راه اندازی node.js و کلیه پیش نیازهای لازم نصب فریم ورک react روی لوکال و انجام تست های لازم آغاز آشنایی …
فصلِ:
1
,
تعداد قسمت ها:
15
,
سطح:
متوسط
موضوعات:
آموزش HTML5
آموزش CSS
آموزش JAVASCRIPT
آموزش JQUERY
آموزش PHP
آموزش ASP.NET
آموزش ASP.NET MVC
آموزش PHP MVC
آموزش Phyton
آموزش سئو
آموزش ساخت فروشگاه اینترنتی
آموزش HTML
آموزش ایمیل مارکتینگ
آموزش وردپرس
آموزش فروشگاه ساز اپن کارت
آموزش جوملا
آموزش Virtual Freer
آموزش WHMCS
این فصل در یک نگاه:
رشد و درآمدزایی یک وب سایت یا کسب و کار اینترنتی کاملا به ذوق و مهارت وب مستر یا همان مدیر اصلی وب سایت گره خورده و متاس…
اصول مدیریت وب سایت برای وب مستر شدن برای موفقیت یک وب سایت لازم الاجراست. زیرا شما دوست دارید وب سایت خود را به کارخانه پولسازی تبدیل کنید. این واقعیت رویا نیست. هرکس این اصول را بداند به …
