مشاوره رایگان
دریافت لینک های دانلود
دریافت پستی درب منزل
مبلغ کل:
تومان
جهت دریافت کد تخفیف به کانال تلگرام مراجعه و یا با پشتیبان آنلاین هماهنگ نمایید
آموزش فرمت دهی متن یا Formatting در HTML به همراه مثال
اگر از پردازشگر word استفاده کرده باشید، باید با توانایی این پردازنده در نوشتن متن، کج کردن، یا زیر خط کشیدن آن آشنا شده باشید؛ این فقط سه گزینه از ده گزینه موجود است که نشان می دهد چگونه متن در HTML و XHTML ظاهر می شود.
متن پررنگ (Bold Text)
هر چیزی که در عنصر <b> ... </ b> قرار داده شود، به شکل زیر نشان داده می شود -
مثال :
<!DOCTYPE html>
<html>
<head>
<title>Bold Text Example</title>
</head>
<body>
<p>The following word uses a <b>bold</b> typeface.</p>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
The following word uses a bold typeface.
کج کردن متن (Italic Text)
هر چیزی که در عنصر <i> ... </ i> قرار داده شود Italic شده یا به اصطلاح کج شده و به صورت زیر نمایش داده می شود -
مثال :
<!DOCTYPE html>
<html>
<head>
<title>Italic Text Example</title>
</head>
<body>
<p>The following word uses an <i>italicized</i> typeface.</p>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
The following word uses an italicized typeface.
زیر خط دار شدن متن (Underlined Text)
هر چیزی که در عنصر <u> ... </ u> قرار داده شود با زیر خط زیر نمایش داده می شود -
مثال:
<!DOCTYPE html>
<html>
<head>
<title>Underlined Text Example</title>
</head>
<body>
<p>The following word uses an <u>underlined</u> typeface.</p>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
The following word uses an underlined typeface.
خط کشیدن روی متن (Strike Text)
هر چیزی که در عنصر <strike> ... </ strike> قرار داده می شود با strikethrough نمایش داده می شود که یک خط نازکی است که روی متن کشیده می شود که در مثال زیر نشان داده شده است –
<!DOCTYPE html>
<html>
<head>
<title>Strike Text Example</title>
</head>
<body>
<p>The following word uses a <strike>strikethrough</strike> typeface.</p>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
The following word uses a strikethrough typeface.
فونت Monospaced
محتوایی که در عنصر <tt> ... </ tt> قرار بگیرد به صورت فونت monospaced نوشته می شود. اکثر فونتها به عنوان فونت با عرض متغیر شناخته می شوند زیرا حروف مختلف دارای عرض های مختلف هستند (برای مثال، حرف 'm' بزرگتر از حرف 'i' است). با این حال، در یک فونت monospaced، همه ی حروف دارای عرض یکسانی هستند.
مثال :
<!DOCTYPE html>
<html>
<head>
<title>Monospaced Font Example</title>
</head>
<body>
<p>The following word uses a <tt>monospaced</tt> typeface.</p>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
The following word uses a monospaced typeface.
متن superscript ( چاپ شده در بالا)
در یک عبارت، متنی که در عنصر <sup> ... </ sup> نوشته می شود، بالاتر از بقیه نوشته می شود؛ اندازه فونت مورد استفاده در متن، همان اندازه فونت کاراکترهای اطراف آن است، اما نیم کاراکتر بالای کاراکتر های دیگر نمایش داده می شود.
مثال :
<!DOCTYPE html>
<html>
<head>
<title>Superscript Text Example</title>
</head>
<body>
<p>The following word uses a <sup>superscript</sup> typeface.</p>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
The following word uses a superscript typeface.
متن subscript (چاپ شده در زیر)
در یک عبارت، متنی که در عنصر <sub> ... </ sub> نوشته می شود، پایین تر از بقیه نوشته می شود؛ اندازه فونت مورد استفاده در متن، همان اندازه فونت کاراکترهای اطراف آن است، اما نیم کاراکتر پایین تر از کاراکتر های دیگر نمایش داده می شود.
<!DOCTYPE html>
<html>
<head>
<title>Subscript Text Example</title>
</head>
<body>
<p>The following word uses a <sub>subscript</sub> typeface.</p>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
The following word uses a subscript typeface.
متن درج شده (Inserted Text)
هر چیزی که در عنصر <ins> ... </ ins> قرار داده می شود به عنوان متن درج شده نمایش داده می شود.
مثال:
<!DOCTYPE html>
<html>
<head>
<title>Inserted Text Example</title>
</head>
<body>
<p>I want to drink <del>cola</del> <ins>wine</ins></p>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
I want to drink cola wine
متن حذف شده (Deleted Text)
هر چیزی که در عنصر <del> ... </ del> قرار داده شود، به عنوان متن حذف شده نمایش داده می شود.
مثال :
<!DOCTYPE html>
<html>
<head>
<title>Deleted Text Example</title>
</head>
<body>
<p>I want to drink <del>cola</del> <ins>wine</ins></p>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
I want to drink cola wine
متن بزرگتر (Larger Text)
اندازه فونت محتوایی که در عنصر <big> ... </ big> قرار می گیرد، بزرگتر از بقیه متنی است که اطراف آن وجود دارد -
مثال :
<!DOCTYPE html>
<html>
<head>
<title>Larger Text Example</title>
</head>
<body>
<p>The following word uses a <big>big</big> typeface.</p>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
متن کوچکتر (Smaller Text)
اندازه فونت محتوایی که در عنصر <small> ... </ small> قرار می گیرد، یک سایز، کوچکتر از بقیه متنی است که اطراف آن وجود دارد -
مثال :
<!DOCTYPE html>
<html>
<head>
<title>Smaller Text Example</title>
</head>
<body>
<p>The following word uses a <small>small</small> typeface.</p>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
گروه بندی محتوا (Grouping Content)
عناصر <div> و <span> به شما این امکان را می دهد که چندین عنصر را برای ایجاد بخش یا زیر صفحه، گروهبندی کنید.
به عنوان مثال، شما ممکن است بخواهید تمامی پانویس ها را در یک صفحه درون عنصر <div> قرار دهید تا نشان دهد که تمام عناصر درون عنصر <div> مربوط به پاورقی ها هستند. سپس شما می توانید یک style را به این عنصر <div> اضافه کنید تا با سبک و طراحی خاصی برای کاربر نمایش داده شوند.
مثال :
<!DOCTYPE html>
<html>
<head>
<title>Div Tag Example</title>
</head>
<body>
<div id = "menu" align = "middle" >
<a href = "/index.htm">HOME</a> |
<a href = "/about/contact_us.htm">CONTACT</a> |
<a href = "/about/index.htm">ABOUT</a>
</div>
<div id = "content" align = "left" bgcolor = "white">
<h5>Content Articles</h5>
<p>Actual content goes here.....</p>
</div>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
از سوی دیگر، عنصر <span> می تواند برای گروه بندی عناصر درونی استفاده شود.
بنابراین، اگر قصد دارید، بخشی از یک جمله یا پاراگراف را گروه بندی کنید و آن را در جمله متمایز کنید و به آن style خاصی دهید، می توانید عنصر <span> را به صورت زیر استفاده کنید.
مثال :
<!DOCTYPE html>
<html>
<head>
<title>Span Tag Example</title>
</head>
<body>
<p>This is the example of <span style = "color:green">span tag</span>
and the <span style = "color:red">div tag</span> alongwith CSS</p>
</body>
</html>
کد فوق، نتیجه زیر را تولید می کند –
This is the example of span tag and the div tag alongwith CSS
این تگ ها معمولا با CSS به کار می روند تا شما بتوانید، Style خاصی را به یک بخش از صفحه اعمال کنید.
فصلِ:
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
این فصل در یک نگاه:
رشد و درآمدزایی یک وب سایت یا کسب و کار اینترنتی کاملا به ذوق و مهارت وب مستر یا همان مدیر اصلی وب سایت گره خورده و متاس…
اصول مدیریت وب سایت برای وب مستر شدن برای موفقیت یک وب سایت لازم الاجراست. زیرا شما دوست دارید وب سایت خود را به کارخانه پولسازی تبدیل کنید. این واقعیت رویا نیست. هرکس این اصول را بداند به …
