提问
    首页 > HTML5教程 > HTML基本语法

超实用的html属性

2024-03-14 10:13:36 • 阅读 打赏

 inputmode

在移动端会影响弹出键盘的布局

  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
// 普通任意文本<input type="text" inputmode="text" />// 电话号码<input type="text" inputmode="tel" />// url 地址<input type="text" inputmode="url" />// 邮箱<input type="text" inputmode="email" />// 数字<input type="text" inputmode="numeric" />// 小数<input type="text" inputmode="decimal" />// 搜索<input type="text" inputmode="search" />

poster
用于设置视频预览图(视频播放前显示的图像)

  •  
  •  
// 如果不设置默认视频第一帧<video src="test.map4" poster="test.png"></video>

accesskey

可以为元素设置快捷键，当按下快捷键后，可以聚焦元素

  •  
  •  
// 按下 键盘 Alt + a 可聚焦元素，注意不同操作系统快捷键方式不同<input type="text" accesskey="a" />

tabindex

可以控制用户的 tab 键切换聚焦元素，默认切换的顺序是元素的顺序

  •  
  •  
  •  
  •  
// 按 tab 键切换聚焦顺序<input type="text" tabindex="3" /><input type="text" tabindex="1" /><input type="text" tabindex="2" />

dir

用于设置内部文字的排版方向

  •  
  •  
  •  
<p dir="ltr">从左到右排版</p><p dir="rtl">从右到左排版</p><p dir="auto">自动检测排版</p>

spellcheck

该属性可以启用拼写检查，通常用于富文本编辑

  •  
  •  
// contenteditable 可编辑元素,并且开启拼写检查<div contenteditable spellcheck="true">hell word</div>

translate

可以指定某个元素内容是否触发浏览器的翻译行为，具体取决于浏览器的设置

  •  
  •  
  •  
  •  
// 开启翻译<div translate="yes">hello word</div>// 关闭翻译<div translate="no">hello word</div>

收藏
打赏

相关推荐

关闭
感谢您的支持，我会继续努力！
扫码打赏，建议金额1-10元


提醒：打赏金额将直接进入对方账号，无法退款，请您谨慎操作。