السّلام علیک یا اباعبداللّه الحسین

سبد (0)

تبلیغات

آموزش html

  • اعلان <DOCTYPE!> در ابتدای صفحه، به مرورگر کمک می کند تا صفحه وب را به درستی نمایش دهد.


    اعلان <DOCTYPE!>

    Wiki

    روی وب، صفحات متفاوت زیادی وجود دارد. اگر مرورگر بداند که صفحه مورد نظر از چه نوعی است، می تواند به درستی آنرا نمایش دهد.

    همچنین نسخه های متفاوت زیادی از HTML وجود دارد، و اگر مرورگر نسخه دقیق HTML استفاده شده در صفحه را بداند، می تواند 100% درست آنرا نمایش دهد.

    <DOCTYPE!> یک تگ HTML نیست بلکه یک اعلان است و به مرورگر می گوید چه نسخه HTMLی در صفحه استفاده شده است.

    در این آموزش از HTML5 استفاده شده است.

    مثال (DOCTYPE چیست؟)

    یک سند HTML با یک اعلان که مشخص می کند، HTML5 در صفحه استفاده شده است:

    <!DOCTYPE html>
    <html>
    <head>
    <title>Title of the document</title>
    </head>

    <body>
    The content of the document......
    </body>

    </html>

    نسخه های HTML 

    Wiki

    از اولین روزهای پیدایش وب، نسخه های زیادی از HTML وجود داشته است.

    نسخه سال
    HTML 1991
    HTML+ 1993
    HTML 2.0 1995
    HTML 3.2 1997
    HTML 4.01 1999
    XHTML 1.0 2000
    HTML5 2012
    XHTML5 2013

    اعلان های متداول

    Wiki

    HTML5

    <!DOCTYPE html>

    HTML 4.01

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

    XHTML 1.0

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    READ MORE
  • یک iframe برای نمایش صفحه وب، درون یک صفحه وب دیگر استفاده می شود.


    دستور اضافه کردن یک iframe

    <iframe src="/URL"></iframe>

    URL به مکان صفحه مجزای دیگری اشاره دارد.


    تنظیم عرض و طول iframe

    Wiki

    خصوصیت height و width برای تعیین طول و عرض یک iframe استفاده می شود.

    مقدار این خصوصیت ها به طور پیش فرض بر حسب پیکسل بیان می شود اما می توان آنرا به درصد نیز بیان کرد. (مثل 80 %)

    مثال (iframe چیست؟)

    <iframe src="/demo_iframe.htm" width="200" height="200"></iframe>
    خودتان امتحان کنید »

    حذف Border یا خطوط حاشیه iframe

    Wiki

    خصوصیت frameborder مشخص می کند آیا حاشیه نمایش داده شود یا نه.

    با تنظیم آن به عدد صفر حاشیه برداشته می شود.

    مثال (iframe چیست؟)

    <iframe src="/demo_iframe.htm" frameborder="0"></iframe>
    خودتان امتحان کنید »

    استفاده از iframe به عنوان مقصد یک لینک

    Wiki

    یک iframe می تواند به عنوان مقصد یک لینک استفاده شود.

    خصوصیت target در یک لینک باید به خصوصیت name در عنصر iframe اشاره کند.

    مثال (iframe چیست؟)

    <iframe src="/demo_iframe.htm" name="iframe_a"></iframe>
    <p><a href="http://www.beyamooz.com" target="iframe_a">beyamooz.com</a></p>
    خودتان امتحان کنید »

    تگ iframe

    تگ توضیح
    <iframe>

    تعریف یک صفحه داخل صفحه جاری (frame)

    READ MORE
  • یک URL همان آدرس وب می باشد.

    Wiki

    یک URL می تواند ترکیبی از حروف باشد مثل beyamooz.com یا می تواند یک IP یا Internet Protocol باشد. بیشتر مردم هنگام گشت زنی در اینترنت از نام وب سایت استفاده می کنند زیرا به خاطر سپردن یک نام آسان تر است تا یک IP مثل 192.68.20.50.


    URL یا (Uniform Resource Locator)

    Wiki

    هنگامی که روی یک لینک در صفحه HTML کلیک می کنید، تگ <a> به آدرسی در شبکه جهانی وب اشاره می کند.

    یک URL یا (Uniform Resource Locator) برای فراخوانی یک سند (یا داده هایی دیگر) در اینترنت استفاده می شود.

    یک آدرس وب مثل http://beyamooz.com/index.php/design-page/html از الگوی زیر پیروی می کند:

    scheme://host.domain:port/path/filename

    توضیح

    Wiki

    • scheme:نوع سرویس اینترنتی را تعریف می کند. رایج ترین نوع http می باشد.
    • host: میزبان دامنه (domain host) را تعریف می کند. ( host پیش فرض برای http حروف www می باشد.)
    • domain: نام دامنه اینترنی را تعریف می کند. مثل w3school.com
    • port: در اینجا port number در host تعریف می شود. ( port number به طور پیش فرض برای http عدد 80 می باشد.)
    • path: یک مسیر را در سرور تعریف می کند. (اگر حذف شود، سند باید در فولدر اصلی وب سایتذخیره شده باشد.)
    • file name: نام یک سند یا منبع را تعریف می کند.

    Scheme های رایج

    Wiki

    در جدول زیر لیستی از Scheme های رایج ارائه شده است.

    Scheme مخفف در چه صفحاتی این  scheme استفاده می شود
    http

    HyperText Transfer Protocol

    (پروتکل انتقال ابر متن)

    صفحات وب به صورت معمول با http شروع می شوند. در اینجا اطلاعات رمزگذاری نمی شوند.

    https

    Secure HyperText Transfer Protocol

    (پروتکل انتقال ابر متن به صورت ایمن)

    تمام اطلاعات رمزگذاری شده اند و اطلاعات بصورت ایمن ارسال می شوند.

    ftp

    File Transfer Protocol
    (پروتکل انتقال فایل)

    برای دانلود و آپلود فایل ها در وب سایت استفاده می شود.

    file  

    فایلی روی کامپیوترتان

    READ MORE
  • CSS یا (Cascading Style Sheets) چگونگی نمایش عناصر HTML را مشخص می کند.

    Wiki


    به چگونگی نمایش متن ها نگاه کنید...!

    این متن قرمز است.

    رنگ این متن آبی است و نام فونت آن Times است.

    اندازه این متن 30 پیکسل است.

    خودتان امتحان کنید


    مثال - خودتان امتحان کنید

    استفاده از Styleها، داخل صفحه HTML
    چگونه Styleها را در قسمت <head> صفحه اضافه کنیم.

    لینکی که خط زیر ندارد
    چگونه یک لینک بدون خط زیر (underline) بسازیم.

    لینک به یک فایل CSS خارجی
    چگونه از تگ <link> برای اضافه کردن فایل CSS خارجی استفاده کنیم.


    تعیین شکل نمایش عناصر HTML با CSS

    Wiki

    CSSهمراه با HTML4 معرفی شد تا یک روش بهتری برای Style دهی عناصر HTML ایجاد کند.

    برای اعمال CSS بر روی تگهای HTML سه روش وجود دارد:

    • برگه های استایل خارجی یا External style sheet
    • برگه های استایل داخلی یا Internal style sheet
    • استایل درون تگی یا Inline style

    روش پیشنهادی، گزینه اول یعنی برگه های استایل خارجی است. 

    برای کسب اطلاعات بیشتر درباره CSS می توانید به لینک روبرو مراجعه نمایید: آموزش CSS


    استایل درون تگی - Inline Styles

    Wiki

    قرار دادن Styleها درون تگ HTML بسیاری از مزیت های CSS را با مخلوط کردن محتوا و چگونگی نمایش از بین می برد، از این روش به ندرت استفاده کنید.

    طریقه استفاده به این صورت است که باید Style مورد نظرمان را در تگ مربوطه بیاوریم، مثال زیر نشان می دهد که چگونه رنگ و margin-left تگ <p> را تغییر داده ایم:

    <p style="color:blue;margin-left:20px;">This is a paragraph.</p>

    مثال: تنظیم رنگ پس زمینه عناصر HTML

    خصوصیت background-color رنگ پس زمینه یک عنصر HTML را تنظیم می کند:

    مثال (استفاده از css در HTML)

    <!DOCTYPE html>
    <html>

    <body style="background-color:yellow;">
    <h2 style="background-color:red;">This is a heading</h2>
    <p style="background-color:green;">This is a paragraph.</p>
    </body>

    </html>
    خودتان امتحان کنید »

    خصوصیت background-color از خصوصیت قدیمی و منسوخ شده bgcolor ساخته شده است.

    خودتان امتحان کنید: تنظیم رنگ پس زمینه با استفاده از روش قدیمی


    مثال: تنظیم رنگ و اندازه و فونت عناصر HTML

    خصوصیات font-family , color , font-size به ترتیب اندازه، رنگ و فونت متن را تنظیم می کنند:

    مثال (استفاده از css در HTML)

    <!DOCTYPE html>
    <html>

    <body>
    <h1 style="font-family:verdana;">A heading</h1>
    <p style="font-family:arial;color:red;font-size:20px;">A paragraph.</p>
    </body>

    </html>
    خودتان امتحان کنید »

    خصوصیات font-family , color , font-size از تگ قدیمی و منسوخ شده <font> ساخته شده اند.


    مثال: ترازبندی متن

    خصوصیت text-align در جهت محور X یک متن را ترازبندی می کند:

    مثال (استفاده از css در HTML)

    <!DOCTYPE html>
    <html>

    <body>
    <h1 style="text-align:center;">Center-aligned heading</h1>
    <p>This is a paragraph.</p>
    </body>

    </html>
    خودتان امتحان کنید »

    خصوصیت text-align از تگ قدیمی و منسوخ شده <center> ساخته شده است.

    خودتان امتحان کنید: ترازبندی عنوان با استفاده از روش قدیمی


    برگه های استایل داخلی - Internal Style Sheet

    Wiki

    زمانی که یک فایل HTML با یک Style خاص و یکتا نسبت به بقیه صفحات قالب بندی شده باشد، باید از Style داخلی استفاده کرد.

    Styleهای داخلی در قسمت Head صفحه HTML و توسط تگ <style> مانند زیر معرفی می شوند.

    <head>
    <style type="text/css">
    body {background-color:yellow;}
    p {color:blue;}
    </style>
    </head>

    برگه های استایل خارجی - External Style Sheet

    Wiki

    زمانی که Styleها در چندین صفحه مختلف به کار برده می شوند، استفاده از Style خارجی ایده آل خواهد بود. اینکار شما را قادر می سازد تا فقط با تغییر یک فایل، ظاهر و یا طرح بندی تمام صفحات پروژه تان را تغییر دهید.

    هر صفحه HTML باید با استفاده از تگ <link> به فایل CSS خارجی متصل شود. تگ <link> باید در قسمت head صفحه قرار داده شود.

    <head>
    <link rel="stylesheet" type="text/css" href="/mystyle.css" />
    </head>

    تگ های Style در HTML

    تگ توضیحات
    <style>

    برای تعریف اطلاعات طرح بندی یک سند html استفاده می شود. تگ <style> باید در قسمت head صفحه قرار داده شود.

    <link />

    هر صفحه HTML باید با استفاده از تگ <link> به فایل CSS خارجی متصل شود. تگ <link> باید در قسمت head صفحه قرار داده شود.


    تگ ها و خصوصیات منسوخ شده

    Wiki

    در HTML4 چندین تگ و خصوصیت برای Styleدهی استفاده می شود که این تگ ها در نسخه جدید HTMLپشتیبانی نمی شود.

    به همین منظور از استفاده عناصر و خصوصیات زیر اجتناب نمایید:

    • <font>
    • <center>
    • <strike>
    • color
    • bgcolor
    READ MORE
  • JavaScripts صفحات HTML را پویاتر و جذاب تر می سازد.


    مثال - خودتان امتحان کنید

    Wiki

    Insert a script
    نحوه وارد کردن یک script در یک سند HTML.

    Use of the <noscript> tag
    چاپ یک پیام مناسب برای مرورگرهایی که جاوا اسکریبت را پشتیبانی نمی کنند یا توسط کاربر غیر فعال شده است.


    عنصر script در HTML

    Wiki

    تگ <script> برای برنامه نویسی سمت کاربر استفاده می شود، مثل JavaScript.

    عنصر <script> به دو صورت استفاده می شود یا با نوشتن دستورات درون تگ script یا به صورت یک فایل script خارجی که با خصوصیت src مشخص می شود.

    ممکن است برای تگ <script> خصوصیت type را تنظیم کنیم ("text/javascript") توجه داشته باشید که نیاز به انجام این کار نیست، چون در تمام مرورگرها و در HTML5 زبان اسکریپت پیشفرض، JavaScript است.

    کاربردهای رایج برای JavaScript: دستکاری تصویر، اعتبار سنجی فرم و تغییرات محتوا بصورت پویا می باشد.

    script زیر عبارت Hello World را چاپ می کند:

    مثال (استفاده از javascripts در HTML)

    <script type="text/javascript">
    document.write("Hello World!")
    </script>
    خودتان امتحان کنید »

    نکته: برای یادگیری بیشتر در مورد JavaScript به خودآموز JS HOME مراجعه نمایید.


    عنصر noscript در HTML

    Wiki

    تگ <noscript> زمانی استفاده می شود که script ها در مرورگر غیر فعال شده یا مرورگری است که script سمت کاربر را پشتیبانی نمی کنند.

    عنصر <noscript> می تواند تمام عناصری را که شما می توانید در عنصر body در یک صفحه HTML پیدا کنید را شامل شود.

    محتوای عنصر <noscript> تنها زمانی نشان داده می شود که script پشتیبانی نشود یا در مرورگر کاربر غیر فعال باشد.

    مثال (استفاده از javascripts در HTML)

    <script type="text/javascript">
    document.write("Hello World!")
    </script>
    <noscript>Sorry, your browser does not support JavaScript!</noscript>
    خودتان امتحان کنید »

    تگ های Script

    Wiki

    Tag Description
    <script>

    برای برنامه نویسی سمت کاربر استفاده می شود.

    <noscript>

    زمانی که script سمت کاربر پشتیبانی نشود متنی را به کاربر نشان می دهد.

    READ MORE
  • استفاده از نام رنگ ها در تمام مرورگرها پشتیبانی می شود

    Wiki

    در HTML و CSS می توان از نام رنگ، برای مشخص کردن پس زمینه یک عنصر استفاده کرد.

    نام 147 رنگ همراه با مقدار HEX آنها در جدول زیر لیست شده است. (16 رنگ اصلی همراه با 130 رنگ ترکیبی)

    توجه: نام 16 رنگ اصلی شامل: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white, yellow

    مرتب شده براساس نام رنگ

    نام رنگ HEX رنگ
    AliceBlue #F0F8FF  
    AntiqueWhite #FAEBD7  
    Aqua #00FFFF  
    Aquamarine #7FFFD4  
    Azure #F0FFFF  
    Beige #F5F5DC  
    Bisque #FFE4C4  
    Black #000000  
    BlanchedAlmond #FFEBCD  
    Blue #0000FF  
    BlueViolet #8A2BE2  
    Brown #A52A2A  
    BurlyWood #DEB887  
    CadetBlue #5F9EA0  
    Chartreuse #7FFF00  
    Chocolate #D2691E  
    Coral #FF7F50  
    CornflowerBlue #6495ED  
    Cornsilk #FFF8DC  
    Crimson #DC143C  
    Cyan #00FFFF  
    DarkBlue #00008B  
    DarkCyan #008B8B  
    DarkGoldenRod #B8860B  
    DarkGray #A9A9A9  
    DarkGrey #A9A9A9  
    DarkGreen #006400  
    DarkKhaki #BDB76B  
    DarkMagenta #8B008B  
    DarkOliveGreen #556B2F  
    Darkorange #FF8C00  
    DarkOrchid #9932CC  
    DarkRed #8B0000  
    DarkSalmon #E9967A  
    DarkSeaGreen #8FBC8F  
    DarkSlateBlue #483D8B  
    DarkSlateGray #2F4F4F  
    DarkSlateGrey #2F4F4F  
    DarkTurquoise #00CED1  
    DarkViolet #9400D3  
    DeepPink #FF1493  
    DeepSkyBlue #00BFFF  
    DimGray #696969  
    DimGrey #696969  
    DodgerBlue #1E90FF  
    FireBrick #B22222  
    FloralWhite #FFFAF0  
    ForestGreen #228B22  
    Fuchsia #FF00FF  
    Gainsboro #DCDCDC  
    GhostWhite #F8F8FF  
    Gold #FFD700  
    GoldenRod #DAA520  
    Gray #808080  
    Grey #808080  
    Green #008000  
    GreenYellow #ADFF2F  
    HoneyDew #F0FFF0  
    HotPink #FF69B4  
    IndianRed #CD5C5C  
    Indigo #4B0082  
    Ivory #FFFFF0  
    Khaki #F0E68C  
    Lavender #E6E6FA  
    LavenderBlush #FFF0F5  
    LawnGreen #7CFC00  
    LemonChiffon #FFFACD  
    LightBlue #ADD8E6  
    LightCoral #F08080  
    LightCyan #E0FFFF  
    LightGoldenRodYellow #FAFAD2  
    LightGray #D3D3D3  
    LightGrey #D3D3D3  
    LightGreen #90EE90  
    LightPink #FFB6C1  
    LightSalmon #FFA07A  
    LightSeaGreen #20B2AA  
    LightSkyBlue #87CEFA  
    LightSlateGray #778899  
    LightSlateGrey #778899  
    LightSteelBlue #B0C4DE  
    LightYellow #FFFFE0  
    Lime #00FF00  
    LimeGreen #32CD32  
    Linen #FAF0E6  
    Magenta #FF00FF  
    Maroon #800000  
    MediumAquaMarine #66CDAA  
    MediumBlue #0000CD  
    MediumOrchid #BA55D3  
    MediumPurple #9370D8  
    MediumSeaGreen #3CB371  
    MediumSlateBlue #7B68EE  
    MediumSpringGreen #00FA9A  
    MediumTurquoise #48D1CC  
    MediumVioletRed #C71585  
    MidnightBlue #191970  
    MintCream #F5FFFA  
    MistyRose #FFE4E1  
    Moccasin #FFE4B5  
    NavajoWhite #FFDEAD  
    Navy #000080  
    OldLace #FDF5E6  
    Olive #808000  
    OliveDrab #6B8E23  
    Orange #FFA500  
    OrangeRed #FF4500  
    Orchid #DA70D6  
    PaleGoldenRod #EEE8AA  
    PaleGreen #98FB98  
    PaleTurquoise #AFEEEE  
    PaleVioletRed #D87093  
    PapayaWhip #FFEFD5  
    PeachPuff #FFDAB9  
    Peru #CD853F  
    Pink #FFC0CB  
    Plum #DDA0DD  
    PowderBlue #B0E0E6  
    Purple #800080  
    Red #FF0000  
    RosyBrown #BC8F8F  
    RoyalBlue #4169E1  
    SaddleBrown #8B4513  
    Salmon #FA8072  
    SandyBrown #F4A460  
    SeaGreen #2E8B57  
    SeaShell #FFF5EE  
    Sienna #A0522D  
    Silver #C0C0C0  
    SkyBlue #87CEEB  
    SlateBlue #6A5ACD  
    SlateGray #708090  
    SlateGrey #708090  
    Snow #FFFAFA  
    SpringGreen #00FF7F  
    SteelBlue #4682B4  
    Tan #D2B48C  
    Teal #008080  
    Thistle #D8BFD8  
    Tomato #FF6347  
    Turquoise #40E0D0  
    Violet #EE82EE  
    Wheat #F5DEB3  
    White #FFFFFF  
    WhiteSmoke #F5F5F5  
    Yellow #FFFF00  
    YellowGreen #9ACD32  
    READ MORE
  • مثال (اعلان DOCTYPE در HTML)

    <!DOCTYPE html>
    <html>
    <head>
    <title>Title of the document</title>
    </head>

    <body>
    The content of the document......
    </body>

    </html>

    خودتان امتحان کنید »

    تعریف و کاربرد اعلان DOCTYPE در HTML

    اعلان <DOCTYPE!> باید در اولین شروع کد نویسی یعنی قبل از تگ <HTML> قرار گیرد.

    <DOCTYPE!> یک تگ HTML نیست بلکه یک دستور راهنما برای مرورگرهای وب است تا نوع نسخه HTMLاستفاده شده را برای مرورگر مشخص کند.

    بدلیل اینکه HTML4.01 بر مبنای SGML است، اعلان <DOCTYPE!> آن به یک DTD اشاره می کند.. DTD قوانین مشخص برای زبان نشانه گذاری است به طوری که مرورگرها ارائه محتوا را به درستی انجام دهند.

    HTML5مبنی بر SGML نمی باشد بنابراین اشاره به یک DTD نیاز ندارد.

    نکته:همیشه <DOCTYPE!> را به صفحه HTML خود اضافه کنید تا مرورگر بداند چه نوع سندی را پیش رو دارد.


    پشتیبانی مرورگرها از اعلان DOCTYPE در HTML

    عنصر          
    <!DOCTYPE> بله بله بله بله بله

    تفاوت بین HTML 4.01 و HTML5

    در HTML4.01 سه اعلان مختلف <DOCTYPE> وجود دارد ولی در HTML5 فقط یکی وجود دارد.

    <!DOCTYPE html>

    نکته ها و ترفندها

    نکته:اعلان <DOCTYPE> حساس به حروف بزرگ و کوچک نیست.


    اعلان های  DOCTYPE

    HTML 5

    <!DOCTYPE html>

    HTML 4.01 اکید(Strict)

    این DTD شامل همه ی عناصر و ویژگی های HTML می باشد اما عناصر نمایشی (مانند تگ font) را در بر نمی گیرد. استفاده از FRAMSET (فریم) امکان پذیر نیست.

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

    HTML 4.01 انتقالی(Transitional)

    این DTD شامل همه ی عناصر و ویژگی های HTML می باشد و همچنین عناصر نمایشی(مانند font) را نیز در بر می گیرد. استفاده از FRAMSET (فریم) امکان پذیر نیست.

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

    HTML 4.01 فریم ها (Frameset)

    این DTD با HTML4.01 انتقالی یکسان است اما استفاده از FRAMSET (فریم) امکان پذیر است.

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

    XHTML 1.0 اکید(Strict)

    این DTD شامل همه ی عناصر و ویژگی های HTML می باشد اما عناصر نمایشی (مانند font) را در بر نمی گیرد. استفاده از FRAMSET (فریم) امکان پذیر نیست. در XHTML تمام تگ ها و ویژگی ها باید با حروف کوچک و مانند XML نوشته شود.

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

    XHTML 1.0 اتتقالی (Transitional)

    این DTD شامل همه ی عناصر و ویژگی های HTML می باشد اما عناصر نمایشی (مانند font) را در بر می گیرد. استفاده از FRAMSET (فریم) امکان پذیر نیست. در XHTML تمام تگ ها و ویژگی ها باید با حروف کوچک و مانند XML نوشته شود.

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    XHTML 1.0 فریم ها( Frameset)

    این DTD با XHTML0.1 انتقالی یکسان است اما استفاده از FRAMSET (فریم) امکان پذیر است.

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

    XHTML 1.1

    این DTD با XHTML0.1 اکید یکسان است. اما به شما امکان اضافه کردن ماژول را می دهد.

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    READ MORE
  • در HTML5، عناصر SVG را می توان به طور مستقیم در صفحه HTML جاسازی کرد.


    SVG چیست؟

    • SVG مخفف کلمات Scalable Vector Graphics می باشد. (گرافیک برداری مقیاس پذیر)
    • SVG برای ایجاد گرافیک های برداری در صفحات وب بکار می رود.
    • SVG زبانی برای توصیف گرافیک 2 بعدی در XML است.
    • با Zoom روی گرافیک، کیفیت کاهش نمی یابد.
    • هر المان و خصوصیتی که در SVG دیده می شود، می تواند متحرک شود.
    • SVG یکی از توصیه های کنسرسیوم w3 می باشد.

    SVG نسخه 1.1 در ژانویه 2003 برای اولین بار توسط W3C توصیه شد. شرکت های Sun Adobe, Apple, IBM, Kodak ازجمله شرکت هایی بودند که بر روی این پروژه کار کرده اند.


    مزایای SVG

    مزایای SVG نسبت به سایر فرمت های عکس (مانند GIF و JPEG):

    • عکس های SVG را می توان با هر Editorی، ایجاد و یا ویرایش کرد.
    • حجم این فایل ها از فرمت های پیکسلی کم تر است.
    • این عکس ها قابلیت تغییر اندازه بدون از دست دادن کیفیت را دارند.
    • متون نوشته شده در این عکس ها بصورت TEXT بوده و قابل انتخاب و جستجو می باشد.
    • فایل های SVG کاملا XML هستند.

    پشتیبانی مرورگرها

    Internet Explorer Firefox Opera Google Chrome Safari

    مرورگرهای Internet Explorer 9+, Firefox, Opera, Chrome, Safari عنصر <svg> را پشتیبانی می کنند.


    قراردادن SVG مستقیماً در صفحات HTML

    در HTML5، عناصر SVG را می توان به طور مستقیم در صفحه HTMLجاسازی کرد:

    مثال (ایجاد گرافیک های برداری در HTML5)

    <!DOCTYPE html>
    <html>
    <body>

    <svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="190">
      <polygon points="100,10 40,180 190,60 10,60 160,180"
      style="fill:lime;stroke:purple;stroke-width:5;fill-rule:evenodd;">
    </svg>

    </body>
    </html>
    خودتان امتحان کنید »

    تفاوت های بین SVG و Canvas

    SVG زبانی برای توصیف گرافیک دو بعدی در XML است.

    عنصر <canvas> در HTML5 از طریق اسکریبت نویسی (معمولاً JavaScript) برای رسم اشکال در یک صفحه وب استفاده می کند.

    XML بودن فایل های SVG این امکان را فراهم می سازد، که دسترسی به عناصر موجود در فایل SVG با توجه به مدل DOM امکان پذیر باشد. همچنین می توانید رویدادهای مختلف JavaScript را به هر عنصری اضافه نمایید.

    در SVG، با هر شکل، مانند یک Object برخورد می شود. اگر ویژگی های Object تغییر کند، مرورگر می تواند به طور خودکار دوباره شکل را بازسازی کند.
    در Canvas، با اشکال، پیکسل به پیکسل برخورد می شود و هنگامی که شکل رسم شد، دیگر در مرورگر قابل دسترس نیست. اگر نیاز است که موقعیت آن عوض شود، باید کل شکل، دوباره ترسیم شود.


    مقایسه Canvas و SVG

    جدول زیر مهمترین تفاوت های Canvas و SVG را نشان می دهد:

    Canvas SVG
    • وابسته به Resolution است.
    • رویدادها را پشتیبانی نمی کند.
    • قابلیت rendering متن، ضعیف است.
    • می توان تصویر نهایی را با فرمت jpg. یا png. ذخیره کرد.
    • برای ساخت بازی، مناسب است.
    • مستقل از Resolution عمل می کند.
    • رویدادها را پشتیبانی می کند.
    • برای برنامه هایی با نواحی rendering بزرگ (مانند نقشه های گوگل) مناسب است.
    •  در صورت پیچیدگی، سرعت rendering پایین است. (هر چیزی که از DOM استفاده کند بسیار کند خواهد بود)
    • برای ساخت بازی، مناسب نیست.
    READ MORE
  • پاراگراف ها، قسمت عمده ای از یک سند HTMLرا تشکیل می دهند.


    پاراگراف ها در HTML

    Wiki

    پاراگراف ها به وسیله تگ <p> تعریف می شوند.

    مثال (پاراگراف ها در HTML)

    <p>This is a paragraph</p>
    <p>This is another paragraph</p>
    خودتان امتحان کنید »

    نکته: مرورگرها به طور خودکار یک خط خالی را قبل و بعد از پاراگراف اضافه می کند.


    تگ پایان را فراموش نکنید

    Wiki

    اغلب مرورگرها حتی اگر تگ پایان را هم نگذاریم صفحه را به درستی نمایش می دهند.

    مثال (پاراگراف ها در HTML)

    <p>This is a paragraph
    <p>This is another paragraph
    خودتان امتحان کنید »

    مثال بالا در بیشتر مرورگرها عمل می کند، اما به آن اطمینانی نیست. فراموش کردن تگ پایان می تواند نتایج غیر منتظره یا خطاهایی را ایجاد کند.

    تذکر: نسخه های آینده HTML به شما اجازه نمی دهد که تگ پایان را فراموش کنید.


    رفتن به خط جدید در HTML

    Wiki

    از تگ </ br> برای رفتن به خط جدید بدون اینکه پاراگراف جدیدی را شروع کنیم استفاده می شود.

    مثال (پاراگراف ها در HTML)

    <p>This is<br />a para<br />graph with line breaks</p>
    خودتان امتحان کنید »

    عنصر </ br> یک عنصر تهی در HTML است. این عنصر دارای تگ پایان نیست.


    <br> یا </ br>

    Wiki

    در XHTML و XML عناصر بدون تگ پایان(تگ بسته) مجاز نمی باشند.

    اگر چه <br>در تمام مرورگرها کار می کند، اما نوشتن </ br> در برنامه های XHTML و XML بهتر عمل می کند.


     خروجی HTML - نکات مفید

    Wiki

    شما نمی توانید مطمئن شوید که کدهای HTML چگونه نمایش داده خواهد شد. صفحات نمایش بزرگ یا کوچک و تغییر اندازه پنجره ها نتایج متفاوتی را به همراه دارد.

    هنگام نوشتن کدهای HTML، نباید انتظار داشته باشید که فاصله ها یا خط های اضافه در کدهای HTML در خروجی مرورگر نیز فاصله یا خط اضافه دیده شوند.

    یک مرورگر فاصله ها و خط های اضافی را هنگام نمایش صفحه بر می دارد. هر تعداد خط به عنوان یک خط و هر تعداد فاصله به عنوان یک فاصله حساب می شوند.

    خودتان امتحان کنید

    (این مثال بعضی از مشکلات فرمت دهی را در HTML نشان می دهد.)


    مشکل نمایش اشعار در مرورگر

    مثال (پاراگراف ها در HTML)

    <p>شعر زیر، در مرورگر پشت سرهم و در یک خط نمایش داده خواهد شد</p>

    <p>

      My Bonnie lies over the ocean.

      My Bonnie lies over the sea.

      My Bonnie lies over the ocean.

      Oh, bring back my Bonnie to me.

    </p>

    خودتان امتحان کنید »

    عنصر <pre> در HTML

    با استفاده از عنصر <pre> می توانید فاصله ها و خط های اضافی داخل متن را به همان صورت در مرورگر نمایش دهید:

    مثال (پاراگراف ها در HTML)

    <p>فاصله و خط های اضافی در شعر زیر به همان صورت نمایش داده خواهد شد</p>

    <pre>
     
      My Bonnie lies over the ocean.

      My Bonnie lies over the sea.

      My Bonnie lies over the ocean.

      Oh, bring back my Bonnie to me.

    </pre>

    خودتان امتحان کنید »

    مثال - خودتان امتحان کنید

    HTML paragraphs
    چگونه پاراگراف ها در مرورگر نشان داده می شود.

    Line breaks
    رفتن به خط جدید در سندهای HTML.

    Poem problems
    بعضی مشکلات در فرمت دهی در HTML.

    More paragraphs
    رفتارهای پیش فرض در پاراگراف ها.


    منبع تگ های HTML

    منبع تگ های HTML حاوی اطلاعات اضافی در مورد عناصر HTML و خصوصیت های آن ها می باشد.

    تگ توضیح
    <p> یک پاراگراف را تعریف می کند.
    <br /> خط جدیدی را وارد می کند.
    READ MORE
  • HTML5 برای پخش صدا،  استانداردی را به وجود آورده است.


    پخش صدا در وب

    تا به حال، هرگز استانداردی برای پخش فایل های صوتی در صفحات وب وجود نداشته است.

    امروزه، فایل های صوتی عموماً از طریق یک پلاگین مثل Flash نشان داده می شوند. هر چند همه مرورگرها، پلاگین های مشابهی ندارند.

    HTML5 روش استانداردی را برای پخش فایل های صوتی با استفاده از عنصر <audio> فراهم کرده است.


    پشتیبانی مرورگرها

    Internet Explorer Firefox Opera Google Chrome Safari

    مرورگرهای Internet Explorer 9+, Firefox, Opera, Chrome, Safari عنصر <audio> را پشتیبانی می کنند.

    توجه: Internet Explorer 8 و نسخه های قدیمی تر آن، عنصر <audio> را پشتیبانی نمی کنند.


    عنصر <audio> چگونه کار می کند؟

    برای پخش یک فایل صوتی در HTML5 تمام آن چیزی که نیاز دارید این چند خط کد زیر است:

    مثال (پخص صدا در HTML5)

    <audio controls>
      <source src="/horse.ogg" type="audio/ogg">
      <source src="/horse.mp3" type="audio/mpeg">
    Your browser does not support the audio element.
    </audio>
    خودتان امتحان کنید »

    ویژگی controls برای افزودن کنترل های play ،pause و صدا می باشد.

     در صورتی که مرورگر از عنصر <audio> پشتیبانی نمی کند باید بین دو تگ <audio> و <audio/> جمله ای مناسب مانند زیر قرار داده شود:

    Your browser does not support the audio tag.

    تگ <audio> به شما اجازه می دهد که چند تگ <source> داشته باشید. تگ های <source> می تواند به فایل های صوتی مختلفی لینک شوند. مرورگر اولین فرمتی که قابلیت پخش آن را داشته باشد، برای کاربر پخش می کند.

    مثال بالا از یک فایل Ogg استفاده کرده است و در مرورگرهای Firefox, Opera, Chrome کار می کند. برای اینکه فایل صوتی در IE و Safari و نسخه های قبلی Chrome نیز پخش شود، باید از فابل های MP3 استفاده کنید. 

    تمام خصوصیت های تگ <audio>

    Autoplay: در صورت وجود فایل صوتی به محض آماده شدن پخش می شود. مقداری که می گیرد: autoplay

    Controls: دکمه های مختلف مثل play و... را اضافه می کند. مقداری که می گیرد: controls

    Loop: در صورت اتمام فایل صوتی دوباره از اول شروع به پخش می کند. مقداری که می گیرد: loop

    Preload: کاری می کند که صدا در هنگام لود شدن صفحه، آماده پخش شود. مقداری که می گیرد: perload

    Src: آدرس فایلی است که باید پخش شود. مقداری که می گیرد: یک url 


    فرمت های صدا و پشتیبانی مرورگرها

    در حال حاضر 3 فرمت تحت پشتیبانی عنصر <audio> قرار دارد.

    • MP3
    • Wav
    • Ogg
     
    Browser MP3 Wav Ogg
    Internet Explorer 9+ YES NO NO
    Chrome 6+ YES YES YES
    Firefox 3.6+ NO YES YES
    Safari 5+ YES YES NO
    Opera 10+ NO YES YES

    MIME Types for Audio Formats

    Format MIME-type
    MP3 audio/mpeg
    Ogg audio/ogg
    Wav audio/wav
    READ MORE
  • مثال (تصاویر در HTML)

    Norwegian Mountain TripPulpit Rock

    خودتان امتحان کنید »

    مثال - خودتان امتحان کنید

    Wiki

    Insert images
    نحوه درج تصویر در سند HTML.

    Insert images from different locations
    نحوه درج تصویر از پوشه ای دیگر یا از سروری دیگر.

    (شما می توانید مثال های بیشتری را در پایین این صفحه مشاهده کنید.)


    تگ <img> و خصوصیت Src

    Wiki

    در HTML، تصاویر به وسیله تگ <img> تعریف می شوند.

    تگ <img> خالی می باشد(یک عنصر تهی می باشد)، به این معنی که این تگ تنها حاوی خصوصیت ها می شود و تگ بسته ای ندارد.

    برای نمایش تصویر در صفحه وب، به خصوصیت src نیاز دارید. src مخفف کلمه source می باشد. مقدار این خصوصیت آدرس URL تصویری است که می خواهید نمایش داده شود. 

    فرم نوشتاری تگ img

    <img src="/url" alt="some_text"/>

    URL اشاره دارد به مکانی که تصویر در آن ذخیره شده است. یک تصویر با نام boat.gif، در پوشه images در سایت beyamooz.com واقع شده که دارای URl به این صورت http://beyamooz.com/images/boat.gif می باشد.

    مرورگر تصویری را که در تگ <img> وجود دارد را نشان می دهد. اگر شما تگ تصویر را بین دو پاراگراف قرار دهید، مرورگر ابتدا پاراگراف اول را نشان می دهد، سپس عکس و بعد از آن پاراگراف دوم را می آورد.


    خصوصیت ALT

    Wiki

    خصوصیت alt یک alternate text یا "متن جایگزین" را برای یک تصویر مشخص می کند، که اگر عکس نمایش داده نشود آن متن نمایش داده می شود.

    ذکر خصوصیت alt الزامی است و بدون آن صفحه وب، استاندارد نخواهد بود.

    <img src="/boat.gif" alt="Big Boat" />

    اگر کاربری به دلایلی (مثل کند بودن اتصال، خطایی در خصوصیت scr رخ دهد یا اگر کاربر از یک screen reader استفاده کند) نتواند عکس را مشاهده کند، خصوصیت alt اطلاعاتی در مورد عکس ارائه می دهد.


    تنظیم طول و عرض یک عکس

    Wiki

    خصوصیت height و width برای مشخص کردن طول و عرض یک عکس استفاده می شود.

    مقدار این خصوصیت ها به طور پیش فرض بر اساس پیکسل مشخص می شوند.

    <img src="/pulpit.jpg" alt="Pulpit rock" width="304" height="228" />

    نکته: این کار خوبی است که خصوصیت عرض و طول یک عکس را مشخص کنید. اگر این خصوصیت ها تنظیم شوند، زمانی که صفحه در حال لود شدن است، مکان مورد نیاز برای عکس در بین دیگر عناصر صفحه رزرو شده است. بنابراین طرح صفحه در حال لود با طرح کاملاً لود شده ی صفحه، تفاوتی نخواهد داشت. اما اگر این خصوصیات را تنظیم نکنید، مرورگر نمی تواند اندازه عکس را تشخیص دهد و اگر تصویری در بین متن باشد. جای آن تا لود کامل تصویر خالی خواهد ماند.


    نکات اساسی و مفید

    Wiki

    نکته: اگر یک فایل HTML حاوی ده تصویر باشد، یازده فایل (شامل 10 فایل تصویر و فایل HTML صفحه) برای نمایش صحیح صفحه نیاز می باشد. بارگذاری تصاویر زمان بر است، بنابراین پیشنهاد ما این است که: از تصاویر، با دقت استفاده کنید.

    نکته: هنگامی که یک صفحه وب بارگذاری می شود، این مرورگر است که در آن لحظه، تصویر را از سرور دریافت می کند و آن را در صفحه درج می کند. بنابراین، مطمئن شوید که تصاویر به طور دقیق در همان نقطه نسبت به صفحه وب قرار گرفته باشند، در غیر این صورت کاربر عکس را نمی بیند و به جای آن یک آیکن با علامت ضربدر می بیند که نشان دهنده آن است که عکسی برای نمایش پیدا نشده است.


    مثال - خودتان امتحان کنید

    Wiki

    Aligning images
    نحوه تراز کردن تصویر در یک متن.

    Let the image float
    چگونه اجازه دهیم یک تصویر در سمت چپ یا راست یک پارگراف قرار گیرد.

    Make a hyperlink of an image
    چگونه از یک تصویر به عنوان لینک استفاده کنیم.

    Create an image map
    چگونه یک image map با ناحیه بندی متفاوت ایجاد کنیم که با کلیک روی هر ناحیه یک لینک اجرا شود.


    تگ های تصویر

    Tag Description
    <img />

    تعریف یک تصویر

    <map>

    تعریف یک image map

    <area />

    تعریف ناحیه ای به صورت لینک در یک image-map

    READ MORE
  • مثال (تگ abbr در HTML)

    استفاده از تگ <abbr> به شرح زیر:

    The <abbr title="World Health Organization">WHO</abbr> was founded in 1948.

    خودتان امتحان کنید »

    تعریف و کاربرد تگ abbr در HTML

    تگ <abbr> مخفف عبارات یا کلمه ای که از حروف اول کلمات دیگر ترکیب شده  را نشان می دهد، مانند "WWW" یا "NATO".

    شما توسط تگ <abbr> (مخفف) می توانید اطلاعات مفیدی را به مرورگرها، موتور جستجو، سیستم ترجمه و هجی کننده ها ارائه دهید.


    پشتیبانی مرورگرها از تگ abbr در HTML

    عنصر          
    <abbr> بله بله بله بله بله

    نکته ها و ترفندها

    نکته: از title می توان استفاده کرد و عبارت کامل آن مخفف را در حالتی که موس روی آن قرار می گیرد نشان داد. (title یکی از ویژگی های عمومی تگ abbr در HTML است)


    تفاوت بین HTML 4.01 و HTML5

    تفاوتی وجود ندارد.


    ویژگی های عمومی تگ abbr در HTML

    تگ <abbr> از تمام ویژگی های عمومی در HTMLپشتیبانی می کند.


    رویدادهای عمومی تگ abbr در HTML

    تگ  <abbr> از تمام رویدادهای عمومی در HTML پشتیبانی می کند.

    READ MORE
  • مثال (تگ acronym در HTML)

    مخفف مشخص شده مطابق زیر:

    Can I get this <acronym title="as soon as possible">ASAP</acronym>?

    خودتان امتحان کنید »

    تعریف و کاربرد تگ acronym در HTML

    تگ <acronym> در HTML5پشتیبانی نمی شود شما می توانید از تگ <abbr> استفاده  کنید.

    تگ <acronym> مخفف یک عبارت را نشان می دهد.

    این مخفف ها می توانند طوری بیان شوندکه به نظر می رسد از اول خودشان یک کلمه بوده اند مانندNATO، NASA، ASAP و GUI.

    شما می توانید با علامت گذاری مخفف یک عبارت، اطلاعات مفیدی به مرورگرها، سیستم های مترجم، موتور های جستجو و هجی کننده ها ارائه دهید.


    پشتیبانی مرورگرها از تگ acronym در HTML

    عنصر          
    <acronym> بله بله بله بله بله

    نکته ها و ترفندها

    نکته:از title می توان استفاده کرد و عبارت کامل آن مخفف را در حالتی که موس روی آن قرار می گیرد نشان داد.


    تفاوت بین HTML 4.01 و HTML5

    تگ <acronym> در HTML5 پشتیبانی نمی شود.

    READ MORE
  • مثال (تگ address در HTML)

    <address>
    Written by <a href="mailto:این آدرس ایمیل توسط spambots حفاظت می شود. برای دیدن شما نیاز به جاوا اسکریپت دارید">Jon Doe</a>.<br>
    Visit us at:<br>
    مثال.com<br>
    Box 564, Disneyland<br>
    USA
    </address>

    خودتان امتحان کنید »

    تعریف و کاربرد تگ address در HTML

    تگ <address> اطلاعات مربوط به تماس نویسنده یا صاحب یک سند یا مقاله را نشان می دهد.

    اگر تگ <address> در داخل تگ <body> قرار گیرد، اطلاعات مربوط به تماس آن سند را نشان می دهد.

    اگر تگ <address> در داخل تگ <article> قرار گیرد، اطلاعات مربوط به تماس آن مقاله را نشان می دهد.

    متن داخل تگ <address> معمولا به صورت italic (مورب) نمایش داده می شود و اکثر مرورگر ها به ابتدا و انتهای عنصر آدرس یک خط فاصله اضافه می کنند.


    پشتیبانی مرورگرها از تگ address در HTML

    عنصر          
    <address> بله بله بله بله بله

    نکته ها و ترفندها

    نکته: تگ <address> نباید برای آدرس پستی  استفاده شود، مگر این که  بخشی از اطلاعات مربوط به تماس باشد.

    نکته: تگ <address> معمولا در کنار سایر اطلاعات در بخش <footer> قرار می گیرد.


    تفاوت بین HTML 4.01 و HTML5

    در HTML4.01 تگ <address> برای تگ <article> پشتیبانی نمی شود،در نتیجه محتویات آن به عنوان اطلاعات مربوط به تماس با نویسنده یا صاحب آن سند شناخته می شود.


    ویژگی های عمومی تگ address در HTML

    تگ <address> از ویژگی های عمومی در HTML پشتیبانی می کند.


    رویدادهای عمومی تگ address در HTML

    تگ <address> از رویدادهای عمومی در HTML پشتیبانی می کند.

    READ MORE
  • مثال (تگ article در HTML)

    <article>
      <h1>Google Chrome</h1>
      <p>Google Chrome is a free, open-source web browser developed by Google,
      released in 2008.</p>
    </article>

    خودتان امتحان کنید »

    تعریف و کاربرد تگ article در HTML

    تگ <article> محتوایی مستقل و جامع را مشخص می کند.

    یک Article باید به تنهایی دارای معنا و مفهوم باشد و بتوان آن را مستقل از سایر اجزای سایت در مکان های مختلف ارائه داد.

    منابع بالقوه برای تگ <article> عبارتند از:

    •  متن پست ها در فروم ها
    • متن مطالب جدید در وبلاگ ها
    • متن خبری در سایت های خبری
    • کامنت ها و نظرات

    پشتیبانی مرورگرها از تگ article در HTML

    اعدادی که در جدول زیر مشخص شده، اولین نسخه ی مرورگرهایی است که به طور کامل از این عنصر پشتیبانی می کنند.

    عنصر          
    <article> 6.0 9.0 4.0 5.0 11.1

    تفاوت بین HTML 4.01 و HTML5

    تگ  <article> در HTML5 جدید است.


    ویژگی های عمومی تگ article در HTML

    تگ <article> از ویژگی های عمومی در HTML پشتیبانی می کند.


    رویدادهای عمومی تگ article در HTML

    تگ <article> از رویدادهای عمومی در HTML پشتیبانی می کند.

    READ MORE
  • مثال (تگ aside در HTML)

    <p>My family and I visited The Epcot center this summer.</p>

    <aside>
      <h4>Epcot Center</h4>
      <p>The Epcot Center is a theme park in Disney World, Florida.</p>
    </aside>

    خودتان امتحان کنید »

    تعریف و کاربرد تگ aside در HTML

    از تگ aside به دو صورت می توان استفاده نمود:

    1. استفاده از تگ aside بصورت تو در تو در دیگر تگ ها: بعنوان مثال اگر از تگ aside داخل تگ articl استفاده می کنید، محتوایی که برای تگ aside در نظر می گیرید باید با محتوای تگ article ارتباط معنایی داشته باشد.
    2. استفاده از تگ aside برای نمایش ستون های سمت راست و چپ: در این حالت هر محتوایی که لازم است در ستون سمت راست و چپ  قرار گیرد را می توان در تگ aside قرار داد. بعنوان مثال در سایت بیاموز، از ستون سمت راست برای نمایش لیست مطالب، تبلیغات و... استفاده شده است.

    پشتیبانی مرورگرها از تگ aside در HTML

    اعدادی که در جدول زیر مشخص شده، اولین نسخه ی مرورگرهایی است که به طور کامل از این عنصر پشتیبانی می کنند.

    عنصر          
    <aside> 6.0 9.0 4.0 5.0 11.1

    تفاوت بین HTML 4.01 و HTML5

    تگ <aside> یک تگ جدید در HTML5 است.


    نکته ها و ترفندها

    نکته: از تگ <aside> می توان به عنوان نوار کناری در یک مقاله استفاده کرد.


    ویژگی های عمومی تگ aside در HTML

    تگ <aside> از ویژگی های عمومی در HTMLپشتیبانی می کند.


    رویدادهای عمومی تگ aside در HTML

    تگ <aside> از رویدادهای عمومی در HTML پشتیبانی می کند.

    READ MORE
  • مثال (تگ audio در HTML)

    پخش صدا:

    <audio controls>
      <source src="/horse.ogg" type="audio/ogg">
      <source src="/horse.mp3" type="audio/mpeg">
      Your browser does not support the audio tag.
    </audio>

    خودتان امتحان کنید »

    تعریف و کاربرد تگ audio در HTML

    تگ <audio> تعیین صوت، مانند موسیقی یا دیگر جریان های صوتی را مشخص می کند.

    در حال حاضر سه نوع فرمت صوتی در تگ <audio> پشتیبانی می شود که عبارتند از: MP3 ،Wav و Ogg:

    Browser MP3 Wav Ogg
    Internet Explorer YES NO NO
    Chrome YES YES YES
    Firefox NO
    Update: Firefox 21 running on Windows 7, Windows 8, Windows Vista, and Android now supports MP3
    YES YES
    Safari YES YES NO
    Opera NO YES YES

    انواع MIME برای فرمت های صوتی:

    Format MIME-type
    MP3 audio/mpeg
    Ogg audio/ogg
    Wav audio/wav

    پشتیبانی مرورگرها از تگ audio در HTML

    اعدادی که در جدول زیر مشخص شده، اولین نسخه ی مرورگرهایی است که به طور کامل از این عنصر پشتیبانی می کنند.

    عنصر          
    <audio> 4.0 9.0 3.5 4.0 10.5

    تفاوت بین HTML 4.01 و HTML5

    تگ <audio> در HTML5 جدید است.


    نکته ها و ترفندها

    نکته: هر نوشته ای که بین <audio> و <audio/> قرار گیرد، در مرورگر هایی که این تگ را پشتیبانی نمی کنند نمایش داده خواهد شد.


    خصوصیت ها

    جدید در HTML5.

    خصوصیت مقدار توضیحات
    autoplay autoplay مشخص می کند که فایل صوتی مورد نظر به محض آماده شدن اجرا شود.
    controls controls مشخص می کند که کنترل های صوتی نمایش داده شوند. (مانند دکمه play ،pause و غیره)
    loop loop مشخص می کند که فایل صوتی هر بار پس از اتمام، دوباره اجرا شود.
    muted muted مشخص می کند که خروجی صدا خاموش باشد.
    preload auto
    metadata
    none
    مشخص می کند که فایل صوتی در صورت نیاز چگونه بارگذاری شود.
    src URL URL مربوط به فایل صوتی را مشخص می کند.

    ویژگی های عمومی تگ audio در HTML

    تگ <audio> از ویژگی های عمومی در HTMLپشتیبانی می کند.


    رویدادهای عمومی تگ audio در HTML

    تگ <audio> از-رویدادهای عمومی در HTML پشتیبانی می کند.


    آموزش های مرتبط

     آموزش HTML-پخش صدا

    آموزش HTML-پخش ویدئو

    READ MORE
  • مثال (تگ base در HTML)

    مشخص کردن یک URL پیش فرض برای تمام لینک های موجود در صفحه:

    <head>
    <base href="http://www.beyamooz.com/images/" target="_blank">
    </head>

    <body>
    <img src="/beyamooz_logo.png" width="24" height="39" alt="Stickman">
    <a href="http://www.beyamooz.com">beyamopz</a>
    </body>

    خودتان امتحان کنید »

    تعریف و کاربرد

    تگ <base> برای تمام URL های نسبی موجود در سند، یک URL هدف و پایه تعیین می کند.

    در هرسند حد اکثر یک <base> می تواند وجود داشته باشد و این تگ باید در <head> قرار گیرد.


    پشتیبانی مرورگرها

    عنصر          
    <base> بله بله بله بله بله

    نکته ها و ترفندها

    نکته: تگ <base> را به عنوان اولین عنصر در <head> قرار دهید تا سایر اجزای موجود در این بخش از اطلاعات <base> استفاده کنند.

    نکته: برای تگ <base> باید از صفت href یا target و یا هر دو استفاده کنیم.


    تفاوت بین HTML 4.01 و HTML5

    تفاوتی وجود ندارد.


    تفاوت بین HTML و XHTML

    در HTML تگ <base> تگ پایانی ندارد.

    در XHTML تگ <base> باید با تگ پایانی خاتمه یابد.


    خصوصیت ها

    خصوصیت مقدار توضیحات
    href URL برای تمام URL های نسبی موجود در صفحه یک URL پایه مشخص می کند.
    target _blank
    _parent
    _self
    _top
    framename
    برای تمام لینک ها و فرم های موجود در صفحه یک target از قبل تعیین شده مشخص می کند.

    ویژگی های عمومی and Events

    تگ <base> از ویژگی های عمومی  در HTMLپشتیبانی می کند.


    رویدادهای عمومی

    تگ <base> از هیچ یک از رویدادهای عمومی پشتیبانی نمی کند.


    آموزش های مرتبط

    مرجع اشیاء اچ تی ام ال: تگ base در JavaScript 

    READ MORE
  • مثال (تگ basefont در HTML)

    مشخص کردن text-color و font-size به طور پیش فرض برای متن در صفحه:

    <head>
    <basefont color="red" size="5">
    </head>

    <body>
    <h1>This is a heading</h1>
    <p>This is a paragraph.</p>
    </body>

    خودتان امتحان کنید »

    تعریف و کاربرد تگ basefont در HTML

    تگ <basefont> در HTML5 پشتیبانی نمی شود، می توانید از CSSاستفاده کنید.

    تگ <basefont> به طور پیش فرض رنگ، سایز و فونت را به تمام متون موجود در سند اختصاص می دهد.


    پشتیبانی مرورگرها از تگ basefont در HTML

    عنصر          
    <basefont> پشتیبانی نمی شود پشتیبانی نمی شود پشتیبانی نمی شود پشتیبانی نمی شود پشتیبانی نمی شود

    نکته: تگ  <basefont> فقط در  Internet Explorer 9 و نسخه های قبل تر از آن را پشتیبانی می کند.


    تفاوت بین HTML 4.01 و HTML5

    تگ  <basefont> در HTML5 پشتیبانی نمی شود.


    خودتان امتحان کنید-مثال

    مثال CSS: نحوه ایجاد text-color از پیش تعیین شده  برای یک صفحه 

    مثال CSS: نحوه ایجاد font-family از پیش تعیین شده برای یک صفحه 

    مثال CSS: نحوه ایجاد font-size از پیش تعیین شده برای یک صفحه

    مطالعه بیشتر درباره ی: آموزش CSS-استایل دهی متن و آموزش CSS-استایل دهی فونت


    خصوصیت های اختیاری

    خصوصیت مقدار توضیحات
    color color در HTML5 پشتیبانی نمی شود.
     مشخص کردن رنگ از پیش تعیین شده برای متن های موجود در سند
    face font_family در HTML5 پشتیبانی نمی شود.
     مشخص کردن یک فونت از پیش تعیین شده برای متن های موجود در سند
    size number در HTML5 پشتیبانی نمی شود.
     مشخص کردن سایز از پیش تعیین شده برای متن های موجود در سند
    READ MORE
  • مثال (تگ bdi در HTML)

    نام های کاربری خارج از زبان اصلی صفحه:

    <ul>
    <li>User <bdi>hrefs</bdi>: 60 points</li>
    <li>User <bdi>jdoe</bdi>: 80 points</li>
    <li>User <bdi>إیان</bdi>: 90 points</li>
    </ul>

    خودتان امتحان کنید »

    تعریف و کاربرد تگ bdi در HTML

     bdi مخفف Bi-Directiona Isolationl  یعنی جدا سازی دو جهته.

     تگ <bdi> برای جهت دادن به متن یا کاراکتراهایی که خارج از زبان اصلی صفحه بوده و از لحاظ فرمت با آن فرق دارد استفاده می شود.

    این عنصر جهت تعبیه محتوایی که کاربر ایجاد می کند و جهت نوشتاری که زبان آن نامشخص است به کار می رود.


    پشتیبانی مرورگرها از تگ bdi در HTML

     اعدادی که در جدول زیر مشخص شده، اولین نسخه ی مرورگرهایی است که به طور کامل از این عنصر پشتیبانی می کنند.

    عنصر          
    <bdi> 16.0 پشتیبانی نمی شود 10.0 پشتیبانی نمی شود پشتیبانی نمی شود

    تفاوت بین HTML 4.01 و HTML5

    تگ <bdi> یک تگ جدید در HTML5 است.


    ویژگی های عمومی تگ bdi در HTML

    تگ <bdi> از ویژگی های عمومی در HTMLپشتیبانی می کند.


    رویدادهای عمومی تگ bdi در HTML

    تگ <bdi> از رویدادهای عمومی در HTML پشتیبانی می کند.

    READ MORE
  • مثال (تگ bdo در HTML)

    نمایش برعکس یک متن:

    <bdo dir="rtl">
    This text will go right-to-left.
    </bdo>

    خودتان امتحان کنید »

    تعریف و کاربرد تگ bdo در HTML

    bdo سرنام واژگان Bi-Directional Override بحساب می آید.

    تگ <bdo> به منظور نادیده گرفتن جهت متن فعلی به کار می رود و در واقع متن را برعکس نشان می دهد.


    پشتیبانی مرورگرها از تگ bdo در HTML

    عنصر          
    <bdo> بله بله بله بله بله

    تفاوت بین HTML 4.01 و HTML5

    تفاوتی وجود ندارد.


    خصوصیت ها

    خصوصیت مقدار توضیحات
    dir ltr
    rtl
    الزامی است و جهت متن موجود در داخل تگ <bdo> را مشخص می کند.

    ویژگی های عمومی تگ bdo در HTML

    تگ <bdo> از ویژگی های عمومی در HTMLپشتیبانی می کند.


    رویدادهای عمومی تگ bdo در HTML

    تگ <bdo> از رویدادهای عمومی در HTML پشتیبانی می کند .

    READ MORE
  • مثال (تگ big در HTML)

    متن بزرگتر از اندازه ی نرمال:

    <p><big>Bigger text</big></p>

    خودتان امتحان کنید »

    تعریف و کاربرد تگ big در HTML

    تگ <big> در HTML5 پشتیبانی نمی شود به جای آن می توان از CSS استفاده کرد.

    تگ <big> قسمتی از متن را درشتر نشان می دهد.


    پشتیبانی مرورگرها از تگ big در HTML

    عنصر          
    <big> بله بله بله بله بله

    تفاوت بین HTML 4.01 و HTML5

    تگ <big> در HTML5 پشتیبانی نمی شود.


    خودتان امتحان کنید-مثال

    مثال CSS: مشخص کردنfont-sizes مختلف برای عناصر HTML

    مطالعه بیشتر درباره ی: آموزش CSS-استایل دهی فونت .

    READ MORE
  • مثال (تگ blockquote در HTML)

    بخشی که به عنوان نقل از منبع دیگر آورده شده:

    <blockquote cite="http://www.worldwildlife.org/who/index.html">
    For 50 years, WWF has been protecting the future of nature. The world's leading conservation organization, WWF works in 100 countries and is supported by 1.2 million members in the United States and close to 5 million globally.
    </blockquote>

    خودتان امتحان کنید »

    تعریف و کاربرد تگ blockquote در HTML

    تگ <blockquote> تعیین کننده بخشی که به نقل از منبع دیگر آورده شده .

    مرورگرها معمولا عناصر تگ <blockquote> را برجسته نشان می دهند.


    پشتیبانی مرورگرها از تگ blockquote در HTML

    عنصر          
    <blockquote> بله بله بله بله بله

    نکته ها و ترفندها

    نکته: برای نقل قول های کوتاه به صورت درون خطی از تگ <q> استفاده کنید.


    تفاوت بین HTML 4.01 و HTML5

    در HTML 4.01، تگ <blockquote> یک نقل قول طولانی را مشخص می کند.

    در HTML5، تگ <blockquote> بخشی که به نقل از منبع دیگری است را مشخص می کند.


    تفاوت بین HTML و XHTML

    نکته: برای معتبر ساختن تگ <blockquote>عناصر موجود در XHTML  لازم است درون این تگ یکی از المان هایی که به صورت بلوک نوشته می شوند را قرار دهیم. به عنوان مثال:

    <blockquote>
    <p>Here is a long quotation here is a long quotation.</p>
    </blockquote>


    خصوصیت ها

    خصوصیت مقدار توضیحات
    cite URL مرجع (منبع) نقل قول را مشخص می کند.

    ویژگی های عمومی تگ blockquote در HTML

    تگ <blockquote> از ویژگی های عمومی در HTMLپشتیبانی می کند.


    رویدادهای عمومی تگ blockquote در HTML

    تگ <blockquote> از رویدادهای عمومی در HTML پشتیبانی می کند.


    آموزش های مرتبط

    مرجع اشیاء اچ تی ام ال: تگ blockquote در JavaScript

    READ MORE
  • مثال (تگ body در HTML)

    یک مثال ساده با حداقل تگ های مورد نیاز:

    <html>
    <head>
    <title>Title of the document</title>
    </head>

    <body>
    The content of the document......
    </body>

    </html>

    خودتان امتحان کنید »

    تعریف و کاربرد تگ body در HTML

    تگ <body> بدنه یک سند HTMLرا توصیف می کند.

    تگ <body> شامل تمام محتویات یک سند است. مانند:متن، عکس، لینک ها، جدول ها و... 


    پشتیبانی مرورگرها از تگ body در HTML

    عنصر          
    <body> بله بله بله بله بله

    تفاوت بین HTML 4.01 و HTML5

    در HTML5 تمام ویژگی های طرح (layout attributes) حذف شده است.


    خصوصیت ها

    خصوصیت مقدار توضیحات
    alink color در HTML5 پشتیبانی نمی شود.
     مشخص کننده رنگ مربوط به یک لینک فعال در سند
    background URL در HTML5 پشتیبانی نمی شود.
     مشخص کننده یک تصویر پس زمینه برای سند
    bgcolor color در HTML5 پشتیبانی نمی شود.
     
    مشخص کننده یک رنگ پس زمینه از سند
    link color در HTML5 پشتیبانی نمی شود.
     
    مشخص کننده رنگ مربوط به لینک های موجود در سند
    text color در HTML5 پشتیبانی نمی شود.
     
    مشخص کننده رنگ مربوط به متن های موجود در سند
    vlink color در HTML5 پشتیبانی نمی شود.
     
    مشخص کننده رنگ مربوط به لینک های مشاهده شده در سند

    ویژگی های عمومی تگ body در HTML

    تگ <body> از ویژگی های عمومی در HTML پشتیبانی می کند.


    رویدادهای عمومی تگ body در HTML

    تگ <body> از رویدادهای عمومی در HTML پشتیانی می کند.


    آموزش های مرتبط

    آموزش HTML-عناصر

    مرجع اشیاء اچ تی ام ال: تگ body در JavaScript 

    READ MORE
  • مثال (تگ br در HTML)

    انتقال قسمتی از متن به خط بعدی:

    This text contains<br>a line break.

    خودتان امتحان کنید »

    تعریف و کاربرد تگ br در HTML

    تگ <br> یک خط جدید ایجاد می کند، و ادامه متن را به خط بعدی انتقال می دهد. 

    تگ <br> یک عنصر تهی در HTMLاست. این عنصر دارای تگ پایان نیست.


    پشتیبانی مرورگرها از تگ br در HTML

    عنصر          
    <br> بله بله بله بله بله

    نکته ها و ترفندها

    نکته: تگ <br> برای نوشتن آدرس و یا اشعار مفید است.

    توجه: از تگ <br> برای رفتن به خط جدید و بدون اینکه پاراگراف جدیدی را شروع کنیم استفاده می شود.


    تفاوت بین HTML 4.01 و HTML5

    تفاوتی وجود ندارد.


    تفاوت بین HTML و XHTML

    در HTML، تگ <br> تگ پایانی ندارد .

    در XHTML  تگ <br> باید با یک تگ پایانی مانند تگ </br> بسته شود.


    ویژگی های عمومی تگ br در HTML

    تگ <br> از ویژگی های عمومی در HTML پشتیبانی می کند.


    رویدادهای عمومی تگ br در HTML

    تگ <br> از رویدادهای عمومی در HTML پشتیبانی می کند.


    آموزش های مرتبط

     آموزش HTML-پاراگراف ها 

    READ MORE
  • مثال (تگ button در HTML)

    ایجاد یک دکمه قابل کلیک شدن:

    <button type="button">Click Me!</button>

    خودتان امتحان کنید »

    تعریف و کاربرد تگ button در HTML

    تگ <button> یک دکمه  قابل کلیک کردن را به وجود می آورد.

    تفاوت دکمه ایجاد شده با تگ<button> و دکمه ایجاد شده با تگ <input> در این است که داخل تگ <button> می توان محتوایی شامل متن یا تصویر گذاشت.

    نکته: همیشه نوع ویژگی ها (attribute) عنصر را مشخص کنید، زیرا مرورگر های مختلف مقادیر مختلفی را به طور پیش فرض برای  عنصر <button> به کار می برند.


    پشتیبانی مرورگرها از تگ button در HTML

    عنصر          
    <button> بله بله بله بله بله

    نکته ها و ترفندها

    نکته: اگر در یک فرم HTML، از تگ <button> استفاده کنید، مرورگر های مختلف ممکن است مقادیر متفاوتی رو ارسال کنند، به همین دلیل در فرم ها از تگ <input> استفاده کنید.


    تفاوت بین HTML 4.01 و HTML5

     HTML5  شامل ویژگی ها (attribute) جدیدی است از جمله:autofocus ،form ،formaction ،formenctypy ،formmethod formnovalidate و formtarget.


    خصوصیت ها

    = جدید در HTML5.

    خصوصیت مقدار توضیحات
    autofocus autofocus مشخص می کند یک button (دکمه) بطور خودکار در کانون توجه قرار می گیرد زمانی که صفحه load می شود.
    disabled disabled

     یک button (دکمه) غیر فعال را مشخص می کند.

    form form_id مشخص می کند که یک button متعلق به کدام فرم یا فرم ها می باشد.
    formaction URL مشخص کننده این است که هنگام ارسال یک فرم داده های مربوط به آن به کجا فرستاده شوند. (فقط برای نوع submit)
    formenctype application/x-www-form-urlencoded
    multipart/form-data
    text/plain
    مشخص کننده این است که داده های مربوط به فرم پیش از ارسال آن فرم چگونه رمزگذاری شود. (فقط برای نوع submit)
    formmethod get
    post
    مشخص کننده این است که داده های مربوط به یک فرم چگونه فرستاده شوند(با استفاده از کدام متد HTTP ). (فقط برای نوع submit)
    formnovalidate formnovalidate مشخص کننده این است که داده های یک فرم احتیاجی به سنجش اعتبار ندارند. (فقط برای نوع submit)
    formtarget _blank
    _self
    _parent
    _top
    framename
    مشخص کننده این است که پیغام کجا نمایش داده شود پس از اینکه فرم ارسال می شود. (فقط برای نوع submit)
    name name مشخص کننده یک نام برای button
    type button
    reset
    submit
    مشخص کننده نوع button
    value text مشخص کننده یک مقدار اولیه برای button

    ویژگی های عمومی تگ button در HTML

    تگ <button> از ویژگی های عمومی درHTML پشتیبانی می کند.


    رویدادهای عمومی تگ button در HTML

    تگ <button> از رویدادهای عمومی در HTML پشتیبانی می کند.


    آموزش های مرتبط

    مرجع اشیاء اچ تی ام ال: تگ button در JavaScript

    READ MORE
  • مثال (تگ caption در HTML)

    یک جدول با عنوان:

    <table>
      <caption>Monthly savings</caption>
      <tr>
        <th>Month</th>
        <th>Savings</th>
      </tr>
      <tr>
        <td>January</td>
        <td>$100</td>
      </tr>
    </table>

    خودتان امتحان کنید »

    تعریف و کاربرد تگ caption در HTML

    تگ <caption> برای جدول یک عنوان معرفی می کند.

    تگ <caption> باید بلافاصله بعد از تگ <table> قرار گیرد.

    نکته: شما می توانید برای هر جدول یک عنوان مشخص کنید.

    نکته: به طور پیش فرض عنوان جدول در وسط و بالای جدول قرار می گیرد. اگر چه با استفاده از خصوصیت text-align و خصوصیت caption-side در CSS می توان عنوان را در جای دیگر تراز کرد.


    پشتیبانی مرورگرها از تگ caption در HTML

    عنصر          
    <caption> بله بله بله بله بله

    تفاوت بین HTML 4.01 و HTML5

    صفت align در HTML5 حذف شده است.


    خصوصیت ها

    خصوصیت مقدار توضیحات
    align left
    right
    top
    bottom
    در HTML5 پشتیبانی نمی شود.
     مشخص می کند که عنوان در کدام جهت تراز شود.

    ویژگی های عمومی تگ caption در HTML

    تگ <caption> از ویژگی های عمومی در HTMLپشتیبانی می کند.


    رویدادهای عمومی تگ caption در HTML

    تگ <caption>از رویدادهای عمومی در HTML پشتیبانی می کند.

    READ MORE
  • مثال (تگ center در HTML)

    تراز متن در مرکز صفحه HTML:

    <center>This text will be center-aligned.</center>

    خودتان امتحان کنید »

    تعریف و کاربرد تگ center در HTML

    تگ <center> در HTML5 پشتیبانی نمی شود. به جای آن از CSS استفاده کنید.

    تگ <center> متن را در وسط صفحه تراز می کند.


    پشتیبانی مرورگرها از تگ center در HTML

    عنصر          
    <center> بله بله بله بله بله

    تفاوت بین HTML 4.01 و HTML5

    تگ<center> در HTML5 پشتیبانی نمی شود.


    خودتان امتحان کنید-مثال

    مثال: Center-align text

    مطالعه بیشتر برای تراز کردن متن با استفاده از: آموزش CSS-استایل دهی متن 

    READ MORE
  • مثال (تگ cite در HTML)

    تعریف عنوان یک کار با تگ <cite>:

    <p><cite>The Scream</cite> by Edward Munch. Painted in 1893.</p>

    خودتان امتحان کنید »

    تعریف و کاربرد تگ cite در HTML

    تگ <cite> عنوان یک کار را مشخص می کند (مثلا یک کتاب، آهنگ، فیلم، برنامه تلویزیونی، نقاشی، مجسمه سازی و...).

    نکته: نام و نام خانوادگی یک فرد نمی تواند عنوان یک کار باشد.


    پشتیبانی مرورگرها از تگ cite در HTML

    عنصر          
    <cite> بله بله بله بله بله

    تفاوت بین HTML 4.01 و HTML5

    در HTML5 تگ <cite> عنوان یک کار را مشخص می کند.

    در HTML 4.01 تگ <cite> یک نقل قول را مشخص می کند.


    ویژگی های عمومی تگ cite در HTML

    تگ <cite> از ویژگی های عمومی در HTMLپشتیبانی می کند.


    رویدادهای عمومی تگ cite در HTML

    تگ <cite> از رویدادهای عمومی در HTML پشتیبانی می کند.

    READ MORE
  • مثال (تگ code در HTML)

    قالب متن در یک سند:

    <code>A piece of computer code</code>

    خودتان امتحان کنید »

    تعریف و کاربرد تگ code در HTML

    تگ <code> یک تگ عبارتی است. این تگ یک قطعه از کد کامپیوتری را نمایش می دهد.

    نکته: استفاده از این تگ توصیه نمی شود ولی برای رسیدن به نتایج بهتر می توان از CSSاستفاده کرد.

    تمام تگ های عبارتی:

    Tag توضیحات
    <em> متن را به صورت emphasized نمایش می دهد 
    <strong> متن را به صورت strong  نمایش می دهد
    <dfn> جهت تعریف definition term
    <code> متن را به صورت یک قطعه کد کامپیوتری نمایش می دهد
    <samp> متن را به صورت sample computer code (نمونه از یک کد کامپیوتری) نمایش می دهد
    <kbd> متن را به صورت keyboard (صفحه کلید) نمایش می دهد
    <var> یک متغیر تعریف می کند

    پشتیبانی مرورگرها از تگ code در HTML

    عنصر          
    <code> بله بله بله بله بله

    تفاوت بین HTML 4.01 و HTML5

    تفاوتی وجود ندارد.


    ویژگی های عمومی تگ code در HTML

    تگ<code> از ویژگی های عمومی در HTMLپشتیبانی می کند.


    رویدادهای عمومی تگ code در HTML

    تگ <code> از رویدادهای عمومی در HTML پشتیبانی می کند.


    آموزش های مرتبط

    آموزش HTML-فرمت دهی متن 

    READ MORE
تمامی محصولات و خدمات این وبسایت، حسب مورد دارای مجوزهای لازم از مراجع مربوطه می‌باشند و فعالیت‌های این سایت تابع قوانین و مقررات جمهوری اسلامی ایران است.
logo-samandehi مجوز نشر دیجیتال از وزرات فرهنگ و ارشاد اسلامی پرداخت آنلاین -  بانک ملت معرفی بیاموز در شبکه سه پرداخت آنلاین - بانک اقتصاد نوین پرداخت آنلاین - بانک سامان
 
دوره های آموزشی راه اندازی کسب و کارهای اینترنتی
تبلیغات اینترنتی