این آموزش در تاریخ ۱۴۰۰/۰۹/۲۱ آپدیت شده است.
آموزش صفت Value در HTML
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش صفت Value در HTML با من همراه باشید.
Free-Learn
آنچه در این جلسه میخوانید :
صفت Value در HTML
صفت value که دیگه از اسمشم مشخصه چیه! صفتی است که با استفاده از آن میتونیم برای یک تگ یک مقدار دلخواه مشخص کنیم، ولی خب این صفت در تگ های مختلف میتونه کارایی مختلفی داشته باشه.
مثلا این صفت در تگ های <button> و <input> و <option> میتونه یک مقدار دلخواه رو داخل اینپوت ها قرار بده که وقتی صفحه بالا اومد اون مقادیر بصورت پیش فرض نمایش داده شوند.
Free-Learn
عناصری که توسط این صفت پشتیبانی می شوند
این صفت را میتوان در عناصر/تگ های زیر بکار برد.
| <meter> | <input> | <button> |
| <progress> | <option> | <li> |
| <param> | ||
Free-Learn
مثال از صفت Value در HTML
در ادامه میتوانید یک مثال از این صفت را مشاهده نمایید.
مثال شماره ۱ : استفاده در تگ Button
|
1 2 3 4 5 6 7 |
<body> <button value="HTML">HTML</button> <button value="CSS">CSS</button> <button value="JavaScript">JavaScript</button> </body> |
مثال شماره ۲ : استفاده در تگ Input
|
1 2 3 4 5 |
<body> <input type="text" name="myname" value="Sadegh"> </body> |
مثال شماره ۳ : استفاده در تگ Meter
|
1 2 3 4 5 6 7 |
<body> <p>1: <meter value="95"></meter></p> <p>2: <meter value="50"></meter></p> <p>3: <meter value="19"></meter></p> </body> |
مثال شماره ۴ : استفاده در تگ Li
|
1 2 3 4 5 6 7 8 9 10 11 |
<body> <ol> <li value="10">Salam</li> <li>Khobi?</li> <li>Man</li> <li>Sadegh</li> <li>Hastam</li> </ol> </body> |
مثال شماره ۵ : استفاده در تگ Option
|
1 2 3 4 5 6 7 8 9 10 11 |
<body> <select name="tarafdari"> <option value="Esteghlal">استقلال</option> <option value="Persepolis">پرسپولیس</option> <option value="Sepahan">سپاهان</option> <option value="Tractor">تراکتور</option> <option value="other">دیگر تیم ها</option> </select> </body> |
مثال شماره ۶ : استفاده در تگ Progress
|
1 2 3 4 5 |
<body> <progress value="75" max="100"></progress> </body> |
مثال شماره ۷ : استفاده در تگ Param ( برای پخش خودکار آهنگ در صفحه )
|
1 2 3 4 5 6 7 |
<body> <object data="files/demo.mp3"> <param name="autoplay" value="true"> </object> </body> |
Free-Learn
پشتیبانی مرورگرها
در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از صفت value در HTML پشتیبانی میکنند یا خیر.
| نام تگ | Chrome | Firefox | Opera | Safari | Edge |
| button | بله | بله | بله | بله | بله |
| input | بله | بله | بله | بله | بله |
| meter | بله | بله | ۱۱ | بله | بله |
| li | بله | بله | بله | بله | بله |
| option | بله | بله | بله | بله | بله |
| progress | بله | بله | ۱۱ | بله | بله |
| param | بله | بله | بله | بله | بله |
Free-Learn
نکات و توضیحات
- در مثال شماره ۷ که قراره آهنگ بصورت پخش خودکار باشه، ممکنه در مرورگرهای مدرن ( موزیلا فایرفاکس یا گوگل کروم ) از پخش خودکار صدا جلوگیری کنند، ولی خب شما میتونید خودتون تعیین کنید که آیا اجازه بده برای پخش خودکار یا خیر. ( آموزش فعالسازی پخش خودکار در مرورگرها )
- در مثال شماره ۷ از تگ object برای پخش آهنگ استفاده شده ولی خب شما نمیخواد از این تگ برای پخش آهنگ استفاده کنید، برای آهنگ فقط از تگ audio و برای ویدئو از تگ video استفاده کنید.
