首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
您找到你想要的搜索结果了吗?
是的
没有找到

DataList:HTML5中的input输入框自动提示利器

DataList的作用是在你往input输入框里输入信息时,根据你敲进去的字母,自动显示一个提示下列列表,很像百度或谷歌的搜索框的自动提示,在飞机票火车票的搜索页面上也有这样的效果。...它是HTML5里新增的一个非常有用的元素。 DataList的表现很像是一个Select下拉列表,但它只是提示作用,并不限制用户在input输入框里输入什么。...HTML5 Datalist的语法其实跟select下拉列表的语法几乎完全一样,非常的简单!...下面我们来看一个实际例子,在下面的输入框里,任意输入几个字母,datalist就会提示给你包含这几个字符的英文国家名称。...非常的简单,以前这样的效果基本上只能用讲Javascript实现,需要你有相当的javascript基本功,而现在,感谢HTML5,只需要纯HTML就能达到这样的神奇效果。

3.2K50

错误提示毁了你的设计!如何在UI界面中优雅的展示“错误”信息?

静电说:用户讨厌看到错误提示,因为这对于任何人来说都是非常沮丧和受挫的。写得不好的错误消息可能会彻底破坏您的用户,甚至损害您的品牌。...今天我们就来分享一些小技巧,让各位设计师能更好的将错误提示展示出来,从而让用户更好的避免操作中的错误,或者至少,让你的用户不那么沮丧。 为什么错误提示非常重要?...因为错误提示打断了用户的操作流程,让用户不再全神贯注。 当用户在工作的时候不断被错误打断,这将极大影响用户的工作效率,会让用户非常的沮丧。...使用更温柔的提示 虽然第一条错误消息的敌意语气确实让我们笑了起来(“我们警告你!这个密码根本不可接受!”),但遇到错误的用户可能并不觉得它很有趣。...其实我们发现,很多的提示消息都是文案问题,对于设计师来说,文字设计也是我们工作的一部分,因此不要忽略这些内容,一个优秀的设计师可以设计好这一切~

1.4K30

《小白HTML5成长之路35》再做一个顶部的提示信息

最近天气干燥,小白和老朱都感冒了,虽然状态不好,小白还是没有停止HTML5前进的脚步,他憋了一股劲一定要在2018年到来之前提高一个台阶。...不但能做提示信息,还能做其他的一些弹窗功能,我先试着实现提示信息的功能吧!”。...不过还有些问题,你现在通过class进行查找移出提示信息,如果连续点色块,提示信息就会产生冲突,所以最好能给每一个提示信息增加一个索引或者id,这样就不会产生冲突了。你再试试!”...“我通过当前页面中提示信息的数量给新的提示信息增加id,当前提示信息的位置根据上一条未消失信息的位置来确定。” 老朱看完以后说道:“恩,不错!...想学H5的朋友可以关注老炉,您的关注是我持续更新《小白HTML5成长之路》的动力! 本篇文章与31、32、33、34内容连续

1.1K90

HTML5

四、HTML5 一、什么是 HTML5 1.HTML5 的概念与定义 定义:HTML5 定义了 HTML 标准的最新版本,是对 HTML 的第五次重大修改,号称下一代的 HTML 两个概念: 是一个新版本的...HTML 语言,定义了新的标签、特性和属性 拥有一个强大的技术集,这些技术集是指: HTML5 、CSS3 、javascript, 这也是广义上的 HTML5 2.HTML5 拓展了哪些内容 语义化标签...本地存储 兼容特性 2D、3D 动画、过渡 CSS3 特性 性能与集成 3.HTML5 的现状 绝对多数新的属性,都已经被浏览器所支持,最新版本的浏览器已经开始陆续支持最新的特性, 总的来说:HTML5...已经是大势所趋 二、HTML5 新增标签 1.什么是语义化 2.新增了那些语义化标签 header --- 头部标签 nav --- 导航标签 article --- 内容标签 section...image.png 3.使用语义化标签的注意 语义化标签主要针对搜索引擎 新标签可以使用一次或者多次 在 IE9 浏览器中,需要把语义化标签都转换为块级元素 语义化标签,在移动端支持比较友好, 另外,HTML5

3.2K20
领券