سبد (0)

فیلم آموزش html

  • تگ iframe در HTML

    21 شهریور 1397

    مثال (تگ iframe در HTML)

    در مثال زیر، با استفاده از تگ iframe سایت بیاموز را در صفحه جاری نمایش می دهیم:

    <iframe src="http://www.beyamooz.com"></iframe>

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

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

    از تگ iframe برای نمایش یک صفحه دیگر در صفحه HTMLکنونی استفاده می شود.

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

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

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

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

    نکته: برای استایل دادن به تگ <iframe> از CSS استفاده می کنیم. (حتی اضافه کردن scrollbars)

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

    در HTML5 تعدادی خصوصیت جدید افزوده شده، در حالی که تعدادی از خصوصیت های HTML4.01 حذف شده است.

    تفاوت بین HTML و XHTML

    در XHTML، خصوصیت name قدیمی شده است و ممکن است در آینده حدف شود. به جای آن می توان از خصوصیت id استفاده کرد.

    خصوصیت ها

    = جدید در HTML5.

    خصوصیت مقدار توضیحات
    align left
    right
    top
    middle
    bottom    		 در HTML5 پشتیبانی نمی شود.
     مشخص می کند که <iframe> نسبت به عناصر اطراف چگونه ترازبندی شود.
    frameborder 1
    0    		 در HTML5 پشتیبانی نمی شود.
    مشخص می کند که حاشیه اطراف <iframe> نمایش داده شود یا خیر.
    height pixels ارتفاع یک <iframe> را مشخص می کند.
    longdesc URL در HTML5 پشتیبانی نمی شود.
    صفحه ای که شامل شرح کامل راجع به محتویات <iframe> است را مشخص می کند.
    marginheight pixels در HTML5 پشنیبانی نمی شود.
    حاشیه بالا وپایین <iframe> را مشخص می کند.
    marginwidth pixels

    در HTML5 پشنیبانی نمی شود.
    حاشیه چپ و راست <iframe> را مشخص می کند.
    ame text یک name برای <iframe> مشخص می کند.
    sandbox ""
    allow-forms
    allow-same-origin
    allow-scripts
    allow-top-navigation    		 قادر است مجموعه ای از محدودیت های اضافی برای محتویات <iframe> مشخص کند.
    scrolling yes
    no
    auto    		 در HTML5 پشتیبانی نمی شود.
    مشخص می کند که scrollbar (نوار اسکرول) در یک <iframe> نمایش داده شود یا خیر.
    seamless seamless  مشخص می کند که <iframe> باید شبیه آن قسمت از محتویات سند دیده شود.
    src URL آدرس سندی که می خواهیم در <iframe> نمایش دهد.
    srcdoc HTML_code محتویات HTML صفحه ای که باید در <iframe> نمایش داده شود.
    width pixels عرض یک <iframe> را مشخص می کند.

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

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

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

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

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

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

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

    READ MORE

  • تگ input در HTML

    21 شهریور 1397

    مثال (تگ input در HTML)

    یک فرم HTML با سه فیلد input، دو text fields و یک دکمه submit:

    <form action="demo_form.asp">
      First name: <input type="text" name="fname"><br>
      Last name: <input type="text" name="lname"><br>
      <input type="submit" value="Submit">
    </form>

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

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

    تگ <input> مشخص کننده یک فیلد ورودی، که کاربر می تواند در آن اطلاعات را وارد کند.

    عنصر <input> به منظور اعلام کنترل ورودی داخل عنصر <form> قرار می گیرد، که کاربر می تواند اطلاعات را وارد کند.

    یک فیلد input را می توان در زمینه های گوناگون، بسته به نوع خصوصیت type استفاده کرد.

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

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

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

    نکته: عنصر <input> خالی بوده و تنها شامل ویژگی ها می باشد.

    نکته: استفاده از عنصر <label> برای تعریف یک برچسب برای عنصر <input> است.

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

    ویژگی "align" در HTML5 پشتیبانی نمی شود.

    در HTML5، تگ  <input> چندین ویژگی جدید دارد و برای ویژگی type چندین مقدار جدید تعریف شده است.

    تفاوت بین  HTML و XHTML

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

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

    خصوصیت ها

    = جدید در HTML5.

    خصوصیت مقدار توضیحات
    accept file_extension
    audio/*
    video/*
    image/*
    media_type

    مشخص کننده نوع فایلی که سرور آن را می پذیرد.

    (فقط برای نوع  "file")
    align left
    right
    top
    middle
    bottom

    در HTML5 پشتیبانی نمی شود.

    مشخص می کند که image input در چه جهتی تراز شود.

    (فقط برای نوع "image")
    alt text برای image یک متن جایگزین مشخص می کند.                   (فقط برای نوع  "image")
    autocomplete on
    off    		 این خصوصیت مشخص می کند که مقادیر یک فرم یا یک فیلد متنی بصورت اتوماتیک پر شود یا نه.
    autofocus autofocus این خصوصیت باعث می شود که بعد از لود شدن صفحه، مکان نما بصورت پیشفرض روی آن فیلد قرار گیرد.
    checked checked مشخص می کند که عنصر <input > در هنگام لود شدن صفحه به صورت پیش فرض انتخاب شده باشد.
    (برای نوع "checkbox" یا "radio")
    disabled disabled مشخص می کند که عنصر <input> باید غیر فعال باشد.
    form form_id این خصوصیت فرم یا فرم هایی که فیلد مورد نظر به آن ها تعلق دارد را مشخص می کند.
    formaction URL آدرس فایلی که مقادیر کنترل های ورودی بعد از ارسال در آن پردازش می شوند را مشخص می کند.( برای انواع ورودی submit و image استفاده می شود)
    formenctype application/x-www-form-urlencoded
    multipart/form-data
    text/plain    		 چگونگی رمز کردن داده های فرم، هنگام ارسال را مشخص می کند.(برای انواع ورودی submit و image استفاده می شود)
    formmethod get
    post    		 مشخص می کند که ارسال اطلاعات از فرم HTML به سرور به چه شکل باشد. (برای انواع ورودی submit و image استفاده می شود)
    formnovalidate formnovalidate این خصوصیت نشان می دهد که فیلدهای ورودی برای ارسال به سرور نیاز به اعتبارسنجی ندارد.
    formtarget _blank
    _self
    _parent
    _top
    framename    		 نشان می دهد، پاسخی که از سرور دریافت شده است کجا نمایش داده شود. (برای انواع ورودی submit و image استفاده می شود)
    height pixels ارتفاع عنصر  <input> را مشخص می کند.
     (فقط برای نوع "image")
    list datalist_id این خصوصیت یک datalist را به یک فیلد متنی متصل می کند.
    max number
    date    		 مقدار maximum برای عنصر <input> را مشخص می کند.
    maxlength number تعداد maximum کاراکتری که عنصر <input> در خود جای می دهد.
    min number
    date    		 مقدار minimum برای عنصر<input> را مشخص می کند.
    multiple multiple مشخص می کند که کاربر می تواند بیش از یک مقدار در عنصر   <input> وارد کند.
    name text یک نام برای عنصر <input> مشخص می کند.
    pattern regexp الگویی برای بررسی اعتبار یک فیلد ورودی مشخص می کند.
    placeholder text یک عبارت را به صورت کم رنگ در داخل فیلد ورودی می نویسد که با فوکوس روی آن فیلد از بین می رود و فیلد خالی می شود.
    readonly readonly مشخص می کند که فیلد input فقط خواندنی است.
    required required مشخص می کند که پر کردن فیلد input قبل از ارسال فرم باید انجام شود. 
    size number مشخص می کند که چه تعداد کاراکتر در عنصر<input> جای کیرد. 
    src URL مشخص کننده URL تصویری که به عنوان دکمه ارسال استفاده می شود.(فقط برای نوع "image")
    step number تعداد فواصل قانونی برای یک فیلد input را مشخص می کند.         
    type button
    checkbox
    color
    date
    datetime
    datetime-local
    email
    file
    hidden
    image
    month
    number
    password
    radio
    range
    reset
    search
    submit
    tel
    text
    time
    url
    week    		 مشخص کننده نوع عنصر<input> و اینکه چگونه نمایش داده شود.
    value text برای عنصر <input> مقداری را مشخص می کند.
      
    width pixels عرض عنصر <input> را مشخص می کند.                      (فقط برای نوع "image")

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

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

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

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

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

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

    مرجع اشیاء اچ تی ام ال:

    READ MORE

  • تگ ins در HTML

    23 شهریور 1397

    مثال (تگ ins در HTML)

    یک متن با قسمت هایی که حذف شده و قسمت های جدیدی به آن اضافه شده است:

    <p>My favorite color is <del>blue</del> <ins>red</ins>!</p>

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

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

    تگ <ins> قطعه متنی که داخل سند قرار داده شده است را مشخص می کند.

    نکته: تگ <del> متن حذف شده را نشانه گذاری می کند.

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

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

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

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

    نکته: از تگ <ins> همراه با تگ <del> برای نشانه گذاری متن حذف شده و سایر تغییرات ایجاد شده استفاده نمایید.

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

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

    خصوصیت ها

    خصوصیت مقدار توضیحات
    cite URL مشخص کننده یک URL برای سندی است که توضیح می دهد چرا متن مورد نظر درج شده یا تغییر یافته است. 
    datetime YYYY-MM-DDThh:mm:ssTZD مشخص می کند که متن مورد نظر در چه زمان وتاریخی درج شده یا تغییر یافته است.

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

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

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

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

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

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

    READ MORE

  • تگ kbd در HTML

    21 شهریور 1397

    مثال (تگ kbd در HTML)

    فرمت دهی متن در یک سند:

    <kbd>Keyboard input</kbd>

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

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

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

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

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

    Tag توضیحات
    <em> متن را به صورت emphasized نمایش می دهد.
    <strong> متن را به صورت strong نمایش می دهد.
    <dfn> جهت تعریف definition term
    <code> متن را به صورت computer code نمایش می دهد.
    <samp> متن را به صورت sample computer code نمایش می دهد.
    <kbd> متن را به صورت keyboard نمایش می دهد.
    <var> متن را به صورت variable نمایش می دهد.

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

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

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

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

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

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

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

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

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

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

    READ MORE

  • تگ keygen در HTML

    21 شهریور 1397

    مثال (تگ keygen در HTML)

    یک فرم با فیلد keygen:

    <form action="demo_keygen.asp" method="get">
      Username: <input type="text" name="usr_name">
      Encryption: <keygen name="security">
      <input type="submit">
    </form>

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

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

    تگ <keygen> یک مولد کلیدی جفت، مورد استفاده برای فرم ها ایجاد می کند.

    تگ <keygen> برای فراهم کردن یک راه امن به منظور تایید هویت کاربران در فرم‌هایی نظیر ورود و ثبت نام می‌باشد.هنگامی که کاربر فیلد را پر می کند و ارسال می کند دو کلید  یک کلید خصوصی و یک کلید عمومی ایجاد می شود.

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

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

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

    عنصر          
    <keygen> 1.0 پشتیبانی نمی شود 1.0 1.2 3.0

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

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

    خصوصیت ها

    = جدید در HTML5.

    خصوصیت مقدار توضیحات
    autofocus autofocus مشخص می کند که عنصر <keygen> در هنگام لود شدن صفحه به طور خودکار بر روی آن تمرکز کند.
    challenge challenge مشخص می کند که عنصر <keygen> در هنگام ارسال باید به چالش کشیده شود.
    disabled disabled مشخص می کند که عنصر <keygen> باید غیر فعال شود.
    form form_id یک یا بیشتر فرم که عنصر <keygen> متعلق به آنها است.
    keytype rsa
    dsa
    ec    		 الگوریتم امنیتی کلید را مشخص می کند.
    name name یک نام برای عنصر <keygen> مشخص می کند.

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

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

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

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

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

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

    READ MORE

  • تگ label در HTML

    21 شهریور 1397

    مثال (تگ label در HTML)

    استفاده از دو radio buttons با label های جدا:

    <form action="demo_form.asp">
      <label for="male">Male</label>
      <input type="radio" name="sex" id="male" value="male"><br>
      <label for="female">Female</label>
      <input type="radio" name="sex" id="female" value="female"><br>
      <input type="submit" value="Submit">
    </form>

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

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

    تگ <label> یک برچسب برای عنصر  <input> تعریف می کند.

    تگ <label> به صورت خاصی برای کاربر ارائه نمی شود. با این حال قابلیت استفاده برای کاربرانی که از موس استفاده می کنند را ارتقا می دهد، اگر کاربر بر روی متن داخل عنصر <label> کلیک کند کنترل متن به صورت خودکار به فیلد مربوطه منتقل می شود.

    برای ایجاد ارتباط و شرح دادن تگ <label> با عناصر دیگر باید خصوصیت for برای تگ <label> را مساوی خصوصیت id قراردهیم .

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

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

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

    نکته: یک label را می توان را با استفاده از خصوصیت "for"  یا با قرار دادن عنصر مورد نظر در داخل تگ <label> محدود کرد.

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

    خصوصیت "form" یک خصوصیت جدید در HTML5 است.

    خصوصیت ها

    = جدید در HTML5.

    خصوصیت مقدار توضیحات
    for element_id مشخص کننده id کنترلی است که label به آن تعلق دارد.
    form form_id یک یا بیشتر فرم  که label متعلق به آنهاست را مشخص می کند.

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

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

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

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

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

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

    READ MORE

  • تگ legend در HTML

    21 شهریور 1397

    مثال (تگ legend در HTML)

    گروهی از عناصر مرتبط در یک فرم:

    <form>
      <fieldset>
        <legend>Personalia:</legend>
        Name: <input type="text" size="30"><br>
        Email: <input type="text" size="30"><br>
        Date of birth: <input type="text" size="10">
      </fieldset>
    </form>

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

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

    تگ <legend> یک عنوان یا caption برای عنصر <fieldset> مشخص می کند.

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

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

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

    صفت "align" در HTML5 پشتیبانی نمی شود.

    خصوصیت ها

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

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

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

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

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

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

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

    READ MORE

  • تگ li در HTML

    21 شهریور 1397

    مثال (تگ li در HTML)

    یک لیست ترتیبی (<ol>) و یک لیست غیر ترتیبی (<ul>) در فهرست HTML :

    <ol>
      <li>Coffee</li>
      <li>Tea</li>
      <li>Milk</li>
    </ol>

    <ul>
      <li>Coffee</li>
      <li>Tea</li>
      <li>Milk</li>
    </ul>

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

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

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

    تگ <li> آیتم های یک لیست را تعریف می کند.

    از تگ <li> در لیست های ترتیبی (<ol>) لیست های غیر ترتیبی (<ul>)، و در فهرست منو (<menu>) استفاده می شود.

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

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

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

    خصوصیت "type" در HTML5 پشتیبانی نمی شود.

    خصوصیت "value" در HTML 4.01 توصیه نمی شود اما در HTML5 پشتیبانی می شود.

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

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

    خصوصیت ها

    خصوصیت مقدار توضیحات
    type 1
    A
    a
    I
    i
    disc
    square
    circle    		 درHTML5 پشتیبانی نمی شود.
         نوع شمارشگر آیتم ها را مشخص می کند.
    value number آیتم های یک لیست را مشخص می کند. و مقدار سایر آیتم ها در ادامه از آن مقدار به بعد یکی یکی افزایش می یابد (فقط برای لیست های مرتب (<ol>) استفاده می شود)

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

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

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

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

    مثال

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

     

    A nested list
     نمایش لیست های تو در تو.

    Another nested list
     نمایش لیست های تو در توی پیچیده تر.

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

    آموزش HTML-لیست ها

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

    READ MORE

  • تگ link در HTML

    21 شهریور 1397

    مثال (تگ link در HTML)

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

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

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

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

    تگ <link> ارتباط بین یک سند و یک منبع خارجی را تعریف می کند.

    تگ <link> برای پیوند به style sheets (شیوه نامه های خارجی) استفاده می شود.

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

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

    نکته: عنصر <link> یک عنصر خالی است، و فقط شامل attributes (خصوصیت ها) می باشد.

    نکته: این عنصر تنها در قسمت head قرار می گیرد، اما می توان بارها از آن استفاده کرد.

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

    بعضی از خصوصیت های موجود در HTML 4.01 در HTML5 پشتیبانی نمی شوند.

    خصوصیت "sizes" یک خصوصیت جدید در HTML5 است.

    Differences Between HTML and XHTML

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

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

    خصوصیت ها

    = جدید در HTML5.

    خصوصیت مقدار توضیحات
    charset char_encoding در HTML5 پشتیبانی نمی شود.
    کاراکترها را برای سند لینک شده کد گذاری می کند.
    href URL location یا آدرس سند لینک شده را مشخص می کند.
    hreflang language_code زبان مربوط به متن سند لینک شده را مشخص می کند.
    media media_query مشخص می کند که سند لینک شده برای چه دستگاهی بهینه شده است.
    rel alternate
    archives
    author
    bookmark
    external
    first
    help
    icon
    last
    license
    next
    nofollow
    noreferrer
    pingback
    prefetch
    prev
    search
    sidebar
    stylesheet
    tag
    up    		 الزامی است. رابطه بین سند کنونی و سند لینک شده را مشخص می کند.
    rev reversed relationship در HTML5 پشتیبانی نمی شود.
    رابطه بین سند لینک شده با سند کنونی را مشخص می کند.
    sizes HeightxWidth
    any    		 اندازه یا سایز منبع لینک شده را مشخص می کند. فقط برای rel=icon
    target _blank
    _self
    _top
    _parent
    frame_name    		 در HTML5 پشتیبانی نمی شود.
    مشخص می کند که سند لینک شده کجا و در چه پنجره ای لود شود.
    type media_type نوع media سند لینک شده را مشخص می کند.

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

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

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

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

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

    آموزش HTML-سی اس اس 

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

    READ MORE

  • تگ main در HTML

    21 شهریور 1397

    مثال (تگ main در HTML)

    <main>
      <h1>Web Browsers</h1>
      <p>Google Chrome, Firefox, and Internet Explorer are the most used browsers today.</p>

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

      <article>
        <h1>Internet Explorer</h1>
        <p>Internet Explorer is a free web browser from Microsoft, released in 1995.</p>
      </article>

      <article>
        <h1>Mozilla Firefox</h1>
        <p>Firefox is a free, open-source web browser from Mozilla, released in 2004.</p>
      </article>
    </main>

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

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

    تگ <main> محتوای اصلی یک سند را مشخص می کند.

    محتوای درون عنصر <main> باید منحصر به فرد برای آن سند باشد. عنصر <main> شامل هر محتوایی در سراسر اسناد (مانند ستون های فرعی، لینک های ناوبری، اطلاعات کپی رایت، آرم سایت و فرم جستجو) باشد را نباید تکرار کند.

    نکته: نباید بیش از یک عنصر <main> در سند باشد. عنصر <main> نباید در داخل تگ های دیگر مانند <article> و <aside> ،<footer> ،<header> یا <nav> قرار گیرد.

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

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

    عنصر          
    <main> 6.0 پشتیبانی نمی شود 4.0 5.0 11.1

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

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

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

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

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

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

    READ MORE

  • تگ map در HTML

    21 شهریور 1397

    مثال (تگ map در HTML)

    یک  image-map، با نواحی قابل کلیک:

    <img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap">

    <map name="planetmap">
      <area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun">
      <area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury">
      <area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus">
    </map>

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

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

    تگ <map> برای تعریف یک image-map (تصویر-نقشه) سمت سرویس گیرنده استفاده می شود. یک image-map تصویری است که نواحی مختلف آن قابل کلیک کردن است.

    خصوصیت الزامی name در تگ <map> با خصوصیت usemap در عنصر <img> مرتبط است. و یک ارتباط بین تصویر و نقشه ایجاد می کند.

    عنصر <map> شامل تعدادی عنصر <area> است که نواحی قابل کلیک در تصویر نقشه را ایجاد می کنند.

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

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

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

    نکته: در HTML5، اگر خصوصیت id برای تگ <map> مشخص کردید، باید مقدار آن با مقدار خصوصیت name برابر باشد.

    تفاوت بین HTML و XHTML

    در XHTML، خصوصیت name قدیمی شده است و حذف خواهد شد. به جای آن می توان از خصوصیت id استفاده کرد.

    خصوصیت ها

    خصوصیت مقدار توضیحات
    name mapname الزامی است. یک نام برای image-map مشخص می کند.

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

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

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

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

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

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

    READ MORE

  • تگ mark در HTML

    21 شهریور 1397

    مثال (تگ mark در HTML)

    برجسته کردن قسمت هایی از متن:

    <p>Do not forget to buy <mark>milk</mark> today.</p>

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

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

    تگ <mark> یک متن علامت گذاری شده را مشخص می کند.

    اگر شما می خواهید قسمتی از متن را برجسته کنید از تگ <mark> استفاده کنید.

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

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

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

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

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

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

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

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

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

    READ MORE

  • تگ menu در HTML

    21 شهریور 1397

    مثال (تگ menu در HTML)

    یک منو با زمینه های مختلف عنصر <menuitem> :

    <menu type="context" id="mymenu">
      <menuitem label="Refresh" onclick="window.location.reload();" icon="ico_reload.png">
      </menuitem>
      <menu label="Share on...">
        <menuitem label="Twitter" icon="ico_twitter.png"
        onclick=    "window.open('//twitter.com/intent/tweet?text='+window.location.href);">
        </menuitem>
        <menuitem label="Facebook" icon="ico_facebook.png"
        onclick=    "window.open('//facebook.com/sharer/sharer.php?u='+window.location.href);">
        </menuitem>
      </menu>
      <menuitem label="Email This Page"
      onclick=    "window.location='mailto:?body='+window.location.href;"></menuitem>
    </menu>

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

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

    تگ <menu> یک لیست یا منو از دستورات تعریف می کند.

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

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

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

    عنصر          
    <menu> پشتیبانی نمی شود پشتیبانی نمی شود 8.0
    (only context menus)     		 پشتیبانی نمی شود پشتیبانی نمی شود

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

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

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

    عنصر <menu> در HTML 4.01 توصیه نمی شود.

    عنصر <menu> در HTML5 دوباره تعریف شده است.

    خصوصیت ها

    = جدید در HTML5.

    خصوصیت مقدار توضیحات
    label text یک label (برپسب) قابل رؤیت برای منو مشخص می کند.
    type popup
    toolbar
    context    		 مشخص می کند که چه نوع منویی نمایش داده شود.

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

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

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

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

    READ MORE

  • تگ meta در HTML

    21 شهریور 1397

    مثال (تگ meta در HTML)

    از عنصر <meta> برای توصیف سند استفاده کنید:

    <head>
    <meta charset="UTF-8">
    <meta name="description" content="Free Web tutorials">
    <meta name="keywords" content="HTML,CSS,XML,JavaScript">
    <meta name="author" content="Hege Refsnes">
    </head>

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

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

    تگ <meta> اطلاعاتی در مورد سند HTMLفراهم می کند. این داده ها در صفحه، نمایش داده نمی شوند اما توسط ماشین قابل خواندن هستند.

    عنصر <meta> نوعاً برای مشخص کردن نویسنده، کلمات کلیدی، آخرین تغییرات، توضیحاتی در مورد صفحه و دیگر داده های Meta استفاده می شوند.

    داده های meta توسط مرورگر ها (جهت نحوه نمایش محتویات یا بار گذاری مجدد صفحه)، موتور های جستجو (جهت تعیین کلمات کلیدی) و دیگر سرویس های وب استفاده می شود.

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

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

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

    نکته: تگ<meta> همیشه داخل تگ <head> قرار می گیرد.

    نکته: Metadata همیشه به صورت جفت name و value می آید.

    نکته: اگر ویژگی name یا  http-equiv تعریف شده باشد خصوصیت content نیز باید تعریف شود، اگر هیچ یک از این خصوصیت ها تعریف نشده باشند خصوصیت  content هم نمی تواند تعریف شود.

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

    خصوصیت scheme در HTML5 پشتیبانی نمی شود.

    در HTML5 خصوصیت جدید charset اضافه شده است، که تعریف charset را آسانتر می کند:

    • HTML 4.01: <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    • HTML5: <meta charset="UTF-8">

    تفاوت بین  HTML و XHTML

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

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

    مثال

    مثال 1: مشخص کردن کلمات کلیدی برای موتورهای جستجو:

    <meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">

    مثال 2: توضیحی از محتویات یک صفحه:

    <meta name="description" content="Free Web tutorials on HTML and CSS">

    مثال 3: مشخص کردن نویسنده یک صفحه:

    <meta name="author" content="Hege Refsnes">

    مثال 4: Refresh کردن صفحه هر 30 ثانیه یکبار:

    <meta http-equiv="refresh" content="30">

    خصوصیت ها

    = جدید در HTML5.

    خصوصیت مقدار توضیحات
    charset character_set کد کردن کاراکترها برای سند HTML
    content text دادن مقداری مرتبط با صفت http-equiv یا name
    http-equiv content-type
    default-style
    refresh    		 فراهم کردن یک HTTP header برای اطلاعات یا مقدار صفت content  
    name application-name
    author
    description
    generator
    keywords    		 یک name برای metadata مشخص می کند.
    scheme format/URI در HTML5 پشتیبانی نمی شود.
    طرحی (scheme) برای تفسیر یا ترجمه مقدار صفت content مشخص می کند.

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

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

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

    آموزش HTML-بخش Head

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

    READ MORE

  • تگ meter در HTML

    21 شهریور 1397

    مثال (تگ meter در HTML)

    استفاده از عنصر meter برای اندازه گیری داده ها در یک محدوده داده (یک مقیاس):

    <meter value="2" min="0" max="10">2 out of 10</meter><br>
    <meter value="0.6">60%</meter>

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

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

    تگ <meter> اندازه گیری عددی یا مقدار کسری را در محدوده شناخته شده تعریف می کند. تگ <meter> به عنوان مقیاس نیز شناخته شده است.

    مثال:  نحوه استفاده از دیسک، ارتباط از نتیجه جستجو و غیره.

    نکته: از تگ <meter> نباید برای نشان دادن یک جریان (مانند نوار پیشرفت) استفاده کرد. برای نشان دادن نوار پیشرفت می توانید از تگ <progress> استفاده کنید.

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

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

    عنصر          
    <meter> 8.0 پشتیبانی نمی شود 6.0 6.0 11.0

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

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

    خصوصیت ها

    = جدید در HTML5.

    خصوصیت مقدار توضیحات
    form form_id یک یه چند فرم که عنصر<meter> به آنها تعلق دارد را مشخص می کند.
    high number  رنجی که به عنوان  مقدار high (زیاد) مطرح شده است را مشخص می کند.
    low number رنجی که به عنوان یک مقدار کم مطرح شده است را مشخص می کند.
    max number رنجی برای مشخص کردن مقدار maximum
    min number رنجی برای مشخص کردن مقدار minimum
    optimum number مشخص می کند که برای اندازه گیری چه مقداری بهینه است. 
    value number الزامی است. مقدار رایج اندازه گیری را مشخص می کند.

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

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

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

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

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

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

    READ MORE

  • تگ nav در HTML

    21 شهریور 1397

    مثال (تگ nav در HTML)

    مجموعه ای از لینک های ناوبری:

    <nav>
      <a href="/html/">HTML</a> |
      <a href="/css/">CSS</a> |
      <a href="/js/">JavaScript</a> |
      <a href="/jquery/">jQuery</a>
    </nav>

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

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

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

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

    در مرورگرهای با قابلیت screen reader که برای افراد ناتوان ایجاد شده اند می توان مشخص کرد که محتوای عناصری مثل nav مورد بررسی قرار بگیرد یا اینکه قلم گرفته شوند.

    برای آشنایی بیشتر با screen reader به لینک روبرو مراجعه فرمایید: Screen Reader

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

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

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

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

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

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

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

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

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

    READ MORE

  • تگ noscript در HTML

    21 شهریور 1397

    مثال (تگ noscript در HTML)

    استفاده از تگ <noscript>:

    <script>
    document.write("Hello World!")
    </script>
    <noscript>Your browser does not support JavaScript!</noscript>

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

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

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

     تگ <noscript> می تواند داخل هر دو تگ <head> و <body> قرار گیرد.

     تگ <noscript> هنگامی که داخل عنصر <head> قرار می گیرد: باید شامل عناصر <link> ،<style> و <meta> باشد.

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

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

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

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

    نکته: یگ روش دیگر استفاده از تگ comment (توضیحات) برای مخفی و غیر فعال کردن اسکریپت ها در سمت سرویس دهنده، در مرورگرهایی که آن را پشتیبانی نمی کنند. (به طوری که آنها به صورت متن ساده نمایش داده نمی شود ):

    <script>
    <!--
    function displayMsg()
    {
    alert("Hello World!")
    }
    //-->
    </script> 

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

    در HTML 4.01، تگ <noscript> تنها می تواند در داخل عنصر <body> قرار گیرد.

    در HTML5، تگ <noscript> می تواند داخل هر دو تگ <head> و <body> قرار گیرد.

    تفاوت بین  HTML  و  XHTML

    در XHTML، تگ <noscript> پشتیبانی نمی شود.

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

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

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

    آموزش HTML-جاوا اسکریبت 

    READ MORE

  • تگ object در HTML

    21 شهریور 1397

    مثال (تگ object در HTML)

    چگونگی استفاده از تگ <object> برای جاسازی Flash file:

    <object width="400" height="400" data="helloworld.swf"></object>

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

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

    تگ <object> یک شیء جاسازی شده در یک سند HTML را تعریف می کند. از این عنصر به عنوان جاسازی عناصر چند رسانه ای (مانند صوت، تصویر، اپلتهای جاوا، اکتیو ایکس، PDF، و فلش) در صفحه وب خود استفاده کنید.

    شما همچنین می توانید از تگ <object> برای جاسازی صفحه وب دیگر، به سند HTMLخود استفاده کنید.

    شما می توانید از تگ <param> برای تصویب پلاگین هایی که به وسیله تگ <object> جاساز شده اند استفاده کنید.

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

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

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

    نکته: یک عنصر <object> باید داخل عنصر <body> قرار گیرد. متن موجود بین دو تگ  <object> و </object> متنی جایگزین، برای مرورگر هایی که این تگ را پشتیبانی نمی کنند.

    نکته:برای تصاویر به جای تگ <object> از تگ <img> استفاده می کنیم.

    نکته: حداقل یکی از خصوصیات  "data" یا "type" باید تعریف شود.

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

    بعضی از خصوصیت ها موجود در HTML 4.01، در HTML5 پشتیبانی نمی شود.

    خصوصیت "form" در HTML5 جدید است.

    در HTML5، عناصر object را در داخل فرم ها می توان درج و استفاده کرد.

    در HTML5، عنصر objects دیگر نمی تواند داخل عنصر <head> از یک سند قرار گیرد.

    خصوصیت ها

    = جدید در HTML5.

    خصوصیت مقدار توضیحات
    align top
    bottom
    middle
    left
    right    		 در HTML5 پشتیبانی نمی شود.
     تراز بندی عنصر <object> نسبت به عناصر اطراف را مشخص می کند.
    archive URL در HTML5 پشتیبانی نمی شود.
    فضایی که لیستی از URL را برای بایگانی جدا می کند. بایگانی منابع مربوط به object است.
    border pixels در HTML5 پشتیبانی نمی شود.
     پهنای border اطراف عنصر <object> را مشخص می کند.
    classid class_ID در HTML5 پشتیبانی نمی شود.
    مشخص کننده مقدار Class ID برای شی مورد نظر، که در تنظیمات رجیستری ویندوز و یا در یک URL قرار گیرد.
    codebase URL در HTML5 پشتیبانی نمی شود.
    مشخص می کند که code عنصر object کجا یافت می شود.
    codetype media_type در HTML5 پشتیبانی نمی شود.
    نوع media برای کدی که اشاره به صفت classid دارد را مشخص می کند.
    data URL مشخص کننده URL منابعی که برای object مورد استفاده قرار می گیرد.
    declare declare در HTML5 پشتیبانی نمی شود.
    مشخص می کند که object فقط باید معرفی شود و تا زمانی که نیاز نیست ایجاد یا نصب نشود.
    form form_id مشخص کننده یک یا بیشتر فرم هایی که object متعلق به آنهاست.
    height pixels ارتفاع عنصر object را مشخص می کند.
    hspace pixels در HTML5 پشتیبانی نمی شود.
     فضای خالی چپ و راست عنصر object را مشخص می کند.
    name name یک name برای عنصر object مشخص می کند.
    standby text در HTML5 پشتیبانی نمی شود.
    مشخص کننده متنی که هنگام لود شدن object نمایش داده می شود.
    type media_type نوع media داده که در صفت data مشخص شده را تعریف می کند.
    usemap #mapname مشخص کننده name برای نقشه تصویری سمت کاربر که با object مورد استفاده قرار می گیرد.
    vspace pixels در HTML5 پشتیبانی نمی شود.
     فضای خالی بالا و پایین عنصر object را مشخص می کند.
    width pixels عرض عنصر object را مشخص می کند.

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

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

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

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

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

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

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

    READ MORE

  • تگ ol در HTML

    21 شهریور 1397

    مثال (تگ ol در HTML)

    دو لیست مرتب متفاوت:

    <ol>
      <li>Coffee</li>
      <li>Tea</li>
      <li>Milk</li>
    </ol>

    <ol start="50">
      <li>Coffee</li>
      <li>Tea</li>
      <li>Milk</li>
    </ol>

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

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

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

    از تگ <li> برای آیتم های لیست استفاده می کنیم.

    .

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

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

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

    نکته: برای لیست های نامرتب از تگ <ul> استفاده می کنیم.

    نکته: برای استایل دادن به لیست ها از CSS استفاده می کنیم.

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

    استفاده از خصوصیت های "start" و "type" در  HTML 4.01 توصیه نمی شود، اما در HTML5 پشتیبانی می شود.

    خصوصیت "reversed" در HTML5 جدید است.

    خصوصیت "compact" در HTML5 پشتیبانی نمی شود.

    خصوصیت ها

    = جدید در HTML5.

    خصوصیت مقدار توضیحات
    compact compact در HTML5 پشتیبانی نمی شود.
     مشخص می کند که لیست باید کوچکتر از حد نرمال نمایش داده شود.
    reversed reversed مشخص می کند که لیست به صورت نزولی مرتب شود.(9 و 8 و 7 و...)
    start number مقدار شروع لیست مرتب را مشخص می کند. 
    type 1
    A
    a
    I
    i    		 مشخص می کند که از چه نوع نشانگری در لیست استفاده شود.

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

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

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

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

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

    آموزش HTML-لیست ها 

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

    READ MORE

  • تگ optgroup در HTML

    21 شهریور 1397

    مثال (تگ optgroup در HTML)

    گروه بندی گزینه های مرتبط با استفاده از تگ <optgroup> :

    <select>
      <optgroup label="Swedish Cars">
        <option value="volvo">Volvo</option>
        <option value="saab">Saab</option>
      </optgroup>
      <optgroup label="German Cars">
        <option value="mercedes">Mercedes</option>
        <option value="audi">Audi</option>
      </optgroup>
    </select>

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

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

    تگ <optgroup> برای گروه بندی option های (گزینه ها) مرتبط در یک لیست کشویی استفاده می شود.

    اگر شما دارای یک لیست طولانی از گزینه ها می باشید استفاده از تگ optgroup برای کنترل کردن گزینه ها مرتبط راحت تر است و مورد پسند کاربر نیز می باشد.

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

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

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

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

    خصوصیت ها

    خصوصیت مقدار توضیحات
    disabled disabled مشخص می کند که option-group باید غیر فعال شود.
    label text یک برچسب برای option-group مشخص می کند.

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

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

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

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

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

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

    READ MORE

  • تگ option در HTML

    21 شهریور 1397

    مثال (تگ option در HTML)

    یک لیست کشویی با چهار گزینه:

    <select>
      <option value="volvo">Volvo</option>
      <option value="saab">Saab</option>
      <option value="opel">Opel</option>
      <option value="audi">Audi</option>
    </select>

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

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

    تگ <option> یک گزینه برای لیست انتخاب تعریف می کند.

    <option> داخل عنصر <select> یا عنصر <datalist> قرار می گیرد.

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

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

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

    نکته: تگ <option> می تواند بدون به کار بردن هیچ یک از خصوصیات بکار رود، اما شما معمولا به خصوصیت value برای اینکه مشخص کند چه چیزی به سرور ارسال شود نیاز دارید.

    نکته: اگر شما یک لیست طولانی از گزینه ها داشته باشید می توانید، گزینه های مرتبط را به وسیله تگ <optgroup> گروه بندی کنید.

    خصوصیت ها

    خصوصیت مقدار توضیحات
    disabled disabled مشخص می کند که option باید غیر فعال شود.
    label text یک برچسب کوتاه برای option مشخص می کند.
    selected selected مشخص می کند هنگامی که صفحه لود می شود option ها به طور پیش فرض انتخاب شده باشد.
    value text مشخص می کند که چه مقدار به سرور ارسال شود.

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

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

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

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

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

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

    READ MORE

  • تگ output در HTML

    21 شهریور 1397

    مثال (تگ output در HTML)

    انجام محاسبات و نشان دهنده نتیجه در عنصر <output> :

    <form oninput="x.value=parseInt(a.value)+parseInt(b.value)">0
      <input type="range" id="a" value="50">100
      +<input type="number" id="b" value="50">
      =<output name="x" for="a b"></output>
    </form>

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

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

    تگ <output> نشان دهنده نتیجه یک محاسبه است. (مانند نتیجه محاسبات انجام شده توسط یک اسکریپت)

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

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

    عنصر          
    <output> 10.0 پشتیبانی نمی شود 4.0 5.1 11.0

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

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

    خصوصیت ها

    = جدید در HTML5.

    خصوصیت مقدار توضیحات
    for element_id رابطه بین نتیجه برای محاسبات وعنصر استفاده شده در محاسبات را مشخص می کند.
    form form_id مشخص کننده فرم یا فرم هایی است که عنصر output متعلق به آنهاست.
    name name یک name برای عنصر output مشخص می کند.

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

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

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

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

    READ MORE

  • تگ param در HTML

    21 شهریور 1397

     

    مثال (تگ param در HTML)

    تنظیم پارامتر "autoplay" با مقدار "true":

    <object data="horse.wav">
      <param name="autoplay" value="true">
    </object>

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

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

    تگ <param> برای تعریف پارامترهای  عنصر <object> استفاده می شود.

    نکته: HTML 5 همچنین شامل دو عنصر جدید <audio> و <video> برای پخش صوت و تصویر می باشد.

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

    تگ <param> در همه مرورگرهای اصلی پشتیبانی می شود. با این حال، فرمت فایل تعریف شده در عنصر <object> ممکن است در همه مرورگرها پشتیبانی نشود.

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

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

    خصوصیت "type" و "valuetype" در HTML5 پشتیبانی نمی شود.

    تفاوت بین  HTML  و  XHTML

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

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

    خصوصیت ها

    خصوصیت مقدار توضیحات
    name name یک name برای param مشخص می کند.
    type media_type در HTML5 پشتیبانی نمی شود.
    نوع media پارامتر را مشخص می کند.
    value value یک مقدار برای param مشخص می کند.
    valuetype data
    ref
    object    		 در HTML5 پشتیبانی نمی شود.
    مشخص می کند مقدار مورد نظر از چه نوع است.

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

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

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

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

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

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

    READ MORE

  • تگ pre در HTML

    21 شهریور 1397

    مثال (تگ pre در HTML)

    متن به صورت Preformatted :

    <pre>
    Text in a pre element
    is displayed in a fixed-width
    font, and it preserves
    both      spaces and
    line breaks
    </pre>

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

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

    تگ <pre> متن را به صورت preformatted نمایش می دهد. (خطوط و فاصله های اضافه در نظر گرفته شده را حفظ می کند).

    متن در عنصر <pre> در یک پهنای فونت ثابت (معمولا Courier)، و حفظ همان مقدار فضای خالی  و پرش به خط بعد نمایش داده می شود.

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

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

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

    نکته: از عنصر <pre> هنگام نمایش متن در یک حالت غیر معمول یا به نوعی نمایش کد کامپیوتری داخل صفحه HTMLاستفاده می شود.

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

    خصوصیت "width" در HTML5 پشتیبانی نمی شود.

    خصوصیت ها

    خصوصیت مقدار توضیحات
    width number در HTML5 پشتیبانی نمی شود.
     تعداد ماکزیمم کاراکترهایی که برای هر line قرار می گیرد را مشخص می کند.

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

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

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

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

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

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

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

    READ MORE

  • تگ progress در HTML

    21 شهریور 1397

    مثال (تگ progress در HTML)

    مقدار پیشرفت یک دانلود:

    <progress value="22" max="100"></progress>

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

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

    تگ <progress> نشان دهنده پیشرفت یک پروسه یا کار است.

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

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

    عنصر          
    <progress> 8.0 10.0 16.0 6.0 11.0

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

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

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

    نکته: از تگ <progress> به وسیله JavaScript برای نمایش پیشرفت کار استفاده می کنیم.

    نکته: از تگ <progress> برای نمایش دادن اندازه یا مقیاس استفاده نمی کنیم (به عنوان مثال فضای دیسک استفاده شده و یا ارتباط از نتیجه پرس و جو). برای این کار می توان از تگ <meter> استفاده کنیم.

    خصوصیت ها

    = جدید در HTML5.

    خصوصیت مقدار توضیحات
    max number مشخص می کند که در کل چه مقدار لازم است که پروسه کامل شود.
    value number مشخص می کند که چه مقدار از پروسه پیش رفته است.

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

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

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

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

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

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

    READ MORE

  • تگ q در HTML

    21 شهریور 1397

    مثال (تگ q در HTML)

    یک نقل قول کوتاه:

    <p>WWF's goal is to:
    <q>Build a future where people live in harmony with nature.</q>
    We hope they succeed.</p>

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

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

    تگ <q> یک نقل قول کوتاه را تعریف می کند.

    مرورگرها معمولا علامت نقل قول را در اطراف نقل قول درج می کنند.

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

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

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

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

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

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

    خصوصیت ها

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

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

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

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

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

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

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

    READ MORE

  • تگ rp در HTML

    21 شهریور 1397

    مثال (تگ rp در HTML)

    حاشیه نویسی ruby :

    <ruby>
    漢 <rt><rp>(</rp>ㄏㄢˋ<rp>)</rp></rt>
    </ruby>

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

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

    تگ <rp> تعریف می کند که چه چیزی نشان داده شود، اگر مرورگر از حاشیه نویسی ruby پشتیبانی نکند.

    حاشیه نویسی ruby برای نمایش تلفظ کاراکترهای زبان های آسیای شرقی کاربرد دارد.

    تگ <rp> همراه با تگ <ruby> و تگ <rt> استفاده می شود: تگ <ruby> شامل یک یا چند کاراکتر است که نیاز به تفسیر یا تلفظ صحیح کارکترها دارد، و تگ <rt> برای دادن اطلاعات و اختیار به تگ <rp> که چه چیزی نشان داده شود، هنگامی که مرورگر از حاشیه نویسی ruby پشتیبانی نکند.

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

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

    عنصر          
    <rp> 5.0 5.5 38.0 5.0 15.0

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

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

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

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

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

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

    READ MORE

  • تگ rt در HTML

    21 شهریور 1397

    مثال (تگ rt در HTML)

    حاشیه نویسی ruby:

    <ruby>
    漢 <rt> ㄏㄢˋ </rt>
    </ruby>

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

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

    تگ <rt> توضیح یا تلفظ صحیح حروف (برای تایپوگراف شرق آسیا) در حاشیه نویسی ruby را مشخص می کند.

    تگ <rt> همراه با تگ <ruby> و تگ <rp> به کار می رود: تگ <ruby> شامل یک یا چند کاراکتر است که نیاز به تفسیر یا تلفظ صحیح کارکترها دارد، و تگ <rt> برای دادن اطلاعات و اختیار به تگ <rp> که چه چیزی نشان داده شود، هنگامی که مرورگر از حاشیه نویسی ruby پشتیبانی نکند.

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

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

    عنصر          
    <rt> 5.0 5.5 38.0 5.0 15.0

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

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

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

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

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

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

    READ MORE

  • تگ ruby در HTML

    21 شهریور 1397

    مثال (تگ ruby در HTML)

    حاشیه نویسی ruby:

    <ruby>
    漢 <rt> ㄏㄢˋ </rt>
    </ruby>

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

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

    تگ <ruby> حاشیه نویسی ruby را مشخص می کند.

    حاشیه نویسی ruby برای نمایش تلفظ کاراکترهای زبان های آسیای شرقی کاربرد دارد.

    تگ <ruby> همراه با تگ <rp> و تگ <rt> استفاده می شود: تگ <ruby> شامل یک یا چند کاراکتر است که نیاز به تفسیر یا تلفظ صحیح کارکترها دارد، و تگ <rt> برای دادن اطلاعات و اختیار به تگ <rp> که چه چیزی نشان داده شود، هنگامی که مرورگر از حاشیه نویسی ruby پشتیبانی نکند.

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

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

    عنصر          
    <ruby> 5.0 5.5 38.0 5.0 15.0

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

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

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

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

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

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

    READ MORE

  • تگ s در HTML

    21 شهریور 1397

    مثال (تگ s در HTML)

    متن به صورت خط خورده:

    <p><s>My car is blue.</s></p>
    <p>My new car is silver.</p>

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

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

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

    از تگ <s> برای متن جایگزین یا حذف شده نباید استفاده کرد، می توانیم به جای آن از تگ <del> استفاده کنیم .

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

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

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

    عنصر <s> در HTML 4.01، متن را به صورت خط خورده نمایش می دهد و استفاده از آن هم توصیه نمی شود.

    عنصر <s> در HTML5، مشخص می کند که متن درست، دقیق و مناسب نیست.

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

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

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

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

    READ MORE

در میان شش هزار مطلب آموزشی منتشر شده در بیاموز، جستجو نمایید ...

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