前端 input怎么显示null_小猿圈WEB前端之HTML5+CSS3面试题(一)

f604f9c07791b4d40d64a0d8d6f26c3b.png

学习是一件非常充实的过程,特别是把自己的乐趣变成工作的时候,很多朋友就喜欢学习web前端,所以学习前端,也希望从事前端的工作,但是因为缺少实战经验,所以很多都是卡在面试这关上,下面小猿圈总结了web前端中HTML5+CSS3面试题。

一、移动端(Android IOS)怎么做好用户体验?

1.清晰的视觉纵线

2.信息的分组、极致的减法

3.利用选择代替输入

4.标签及文字的排布方式

5.依靠明文确认密码

6.合理的键盘利用

二、什么是Retina 显示屏,带来了什么问题?

retina:一种具备超高像素密度的液晶屏,同样大小的屏幕上显示的像素点由1个变为多个,如在同样带下的屏幕上,苹果设备的retina显示屏中,像素点1个变为4个

在高清显示屏中的位图被放大,图片会变得模糊,因此移动端的视觉稿通常会设计为传统PC的2倍

那么,前端的应对方案是:

设计稿切出来的图片长宽保证为偶数,并使用backgroud-size把图片缩小为原来的1/2

例如图片宽高为:200px*200px,那么写法如下

.css{width:100px;height:100px;background-size:100px 100px;}

其它元素的取值为原来的1/2,例如视觉稿40px的字体,使用样式的写法为20px

.css{font-size:20px}

三、ios系统中元素被触摸时产生的半透明灰色遮罩怎么去掉

ios用户点击一个链接,会出现一个半透明灰色遮罩, 如果想要禁用,可设置-webkit-tap-highlight-color的alpha值为0,也就是属性值的最后一位设置为0就可以去除半透明灰色遮罩

a,button,input,textarea{-webkit-tap-highlight-color: rgba(0,0,0,0;)}

四、部分android系统中元素被点击时产生的边框怎么去掉

android用户点击一个链接,会出现一个边框或者半透明灰色遮罩, 不同生产商定义出来额效果不一样,可设置-webkit-tap-highlight-color的alpha值为0去除部分机器自带的效果

a,button,input,textarea{

-webkit-tap-highlight-color: rgba(0,0,0,0;)

-webkit-user-modify:read-write-plaintext-only;

}

-webkit-user-modify有个副作用,就是输入法不再能够输入多个字符

另外,有些机型去除不了,如小米2,对于按钮类还有个办法,不使用a或者input标签,直接用div标签。

五、webkit表单元素的默认外观怎么重置

通用:.css{-webkit-appearance:none;}

伪元素改变number类型input框的默认样式

input[type=number]::-webkit-textfield-decoration-container {

background-color: transparent;

}

input[type=number]::-webkit-inner-spin-button {

-webkit-appearance: none;

}

input[type=number]::-webkit-outer-spin-button {

-webkit-appearance: none;

}

六、webkit表单输入框placeholder的颜色值能改变么?

input::-webkit-input-placeholder{color:#AAAAAA;}

input:focus::-webkit-input-placeholder{color:#EEEEEE;}

七、webkit表单输入框placeholder的文字能换行么?

ios可以,android不行

在textarea标签下都可以换行

八、禁止ios 长按时不触发系统的菜单,禁止ios&android长按时下载图片

.css{-webkit-touch-callout: none}

九、禁止ios和android用户选中文字

.css{-webkit-user-select:none}

十、打电话发短信写邮件怎么实现

打电话:<a href="tel:0755-10086">打电话给:0755-10086</a>

发短信,winphone系统无效<a href="sms:10086">发短信给: 10086</a>

写邮件:<a href=“mailto:peun@foxmail.com">peun@foxmail.com</a>

十一、模拟按钮hover效果

移动端触摸按钮的效果,可明示用户有些事情正要发生,是一个比较好体验,但是移动设备中并没有鼠标指针,使用css的hover并不能满足我们的需求,还好国外有个激活移动端css的active效果。

1. 直接在body上添加ontouchstart,同样可激活移动端css的active效果,比较推荐这种方式(兼容性ios5+、部分android 4+、winphone 8)。

2. 要做到全兼容的办法,可通过绑定ontouchstart和ontouchend来控制按钮的类名

十二、audio元素和video元素在ios和andriod中无法自动播放

应对方案:触屏即播

$('html').one('touchstart',function(){

audio.play()

})

以上就是小猿圈web前端老师总结的HTML5+CSS3面试题一部分,想要查看下一部分可以观看的我下篇文章,相信不会让你失望的,学习前端可以到小猿圈网站去看一下最新最全面的前端课程。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/305323.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

使用AXIS开发Web Service的示例

1)先下载Axis的文件包 &#xff1a;http://ws.apache.org/axis/2)新建web工程 名称为&#xff1a;axis 拷贝Axis包中 webapps/axis 目录中的所有文件到工程目录的 webroot 目录中&#xff0c; 然后 刷新 工程 新建一个 java 文件&#xff0c;文件名称为&#xff1a;HelloClient…

聊聊Interlocked.CompareExchange吧?

【导读】私下空余时间一直在研究开源框架&#xff0c;当然也就少不了学习优秀源码&#xff0c;本文也是我查看有关源码时&#xff0c;触碰到我个人知识盲区&#xff0c;做此记录&#xff0c;分享下Interlocked.CompareExchange这玩意用法被讲的很烂了&#xff0c;为何再次被提及…

sae 本地环境 mysql数据库_SAE本地环境与真实环境的差别

其实从刚开始用的时候就发现本地环境和真实环境有不同&#xff0c;导致本地环境我都没怎么用。1、本地环境的php是32bit版本的&#xff0c;真实环境是64bit的。这是我发现的第一个不相同的地方&#xff0c;就是因为这个&#xff0c;直接导致我的应用绝大部分调试工作都是在把代…

winform 统计大量数据重复的元素个数_面试系列:十个海量数据处理方法大总结...

本文将简单总结下一些处理海量数据问题的常见方法。当然这些方法可能并不能完全覆盖所有的问题&#xff0c;但是这样的一些方法也基本可以处理绝大多数遇到的问题。下面的一些问题基本直接来源于公司的面试笔试题目&#xff0c;方法不一定最优&#xff0c;如果你有更好的处理方…

C# 实现一个基于值相等性比较的字典

C# 实现一个基于值相等性比较的字典Intro今天在项目里遇到一个需求&#xff0c;大概是这样的我要比较两个 JSON 字符串是不是相等&#xff0c;JSON 字符串其实是一个 Dictionary<string, string> 但是顺序可能不同&#xff0c;和上一篇 record 使用场景中的第一个需求类似…

RIAMeeting第六次开发者交流活动。

5月的一场大地震带给我们过多的悲痛&#xff0c;但国家还要兴起&#xff0c;技术还要进步&#xff0c;让广大RIA开发者化悲愤为力量&#xff0c;继续开创中国的RIA事业吧&#xff01; 本月的25日&#xff0c;RIAMeeting将举办第六次开发者交流活动&#xff0c;本次活动邀请到了…

java字符串转时间_java字符串和时间转换

import java.text.SimpleDateFormat; import java.util.Date; //将long字符串转换成格式时间输出 public class LongToString {public static void main(String argsp[]){String time="1256006105375"; Date date=new Date(Long.parseLong(time)); SimpleDateFormat …

java 堆栈_Java中线程与堆栈的关系

栈是线程私有的&#xff0c;每个线程都是自己的栈&#xff0c;每个线程中的每个方法在执行的同时会创建一个栈帧用于存局部变量表、操作数栈、动态链接、方法返回地址等信息。每一个方法从调用到执行完毕的过程&#xff0c;就对应着一个栈帧在虚拟机栈中从入栈到出栈的过程。其…

巧用lock解决缓存击穿的解决方案

背景缓存击穿是指缓存中没有但数据库中有的数据&#xff08;一般是缓存时间到期&#xff09;&#xff0c;这时由于并发用户特别多&#xff0c;同时读缓存没读到数据&#xff0c;又同时去数据库去取数据&#xff0c;引起数据库压力瞬间增大&#xff0c;造成过大压力。解决方案1、…

ISA禁止了symantec的LiveUpdate的使用

从我们服务器将symantec升级到10.1.5.5000后&#xff0c;就发现ISA客户端的用户&#xff0c;用LiveUpdate没法升级&#xff0c;点击按钮后也会运行升级&#xff0c;但是到最后总是出现一个红色的大叉&#xff0c;说升级失败。这样客户端就只剩下手动用升级包升级或者是通过服务…

java怎么将前端的数据存到关联的表中_Java程序员最可能被考到的14个面试题

1. 如何只扫描一遍就找到位于一个链表正中间的元素&#xff1f; 这是最受欢迎的算法题之一&#xff0c;经常在电话面试中被问到。很多程序员会想&#xff0c;要知道链表的长度&#xff0c;就要先扫描一遍链表&#xff0c;然后在第二遍中取其正中的元素。所以被要求只扫描一遍就…

java 监听文件内容_java 监听文件内容变化

有时候&#xff0c;我们需要确定某些文件是否有变化而做出一些对应的动作&#xff0c;例如&#xff0c;曾经开发的一款服务器中&#xff0c;由于模块比较多&#xff0c;在运行期间有时候需要单独的输出某个模块日志&#xff0c;但又不可能总是开着日志。log4j中已经实现了可以动…

.NET Core 和 .NET Framework 启动可执行文件的差别

在 Windows 下&#xff0c;使用 .NET Framework 构建出来的应用&#xff0c;可以只有一个可执行文件&#xff0c;在可执行文件里面包含了 IL 代码。使用 .NET Core 构建出来的应用&#xff0c;将会包含一个 Exe 可执行文件&#xff0c;和对应的 Dll 文件&#xff0c;而 IL 代码…

firefox 3.0 在 windows 下的编译

&#xff08;1&#xff09;下载firefox 3.0源代码。下载并安装 mozilla-build &#xff08;2&#xff09;运行 start-msvc9.bat&#xff0c;进入shell界面&#xff0c; 查看环境变量&#xff1a; echo $PATH echo $LIB echo $INCLUDE &#xff08;3&#xff09;确保: windo…

常见的几种最优化方法

阅读目录1. 梯度下降法&#xff08;Gradient Descent&#xff09;2. 牛顿法和拟牛顿法&#xff08;Newtons method & Quasi-Newton Methods&#xff09;3. 共轭梯度法&#xff08;Conjugate Gradient&#xff09;4. 启发式优化方法我们每个人都会在我们的生活或者工作中遇到…

安卓平板运行python_使用Python进行手机平板移动开发 | 学步园

过去&#xff0c;Android和iOS上的移动应用程序开发不是Python的强项&#xff0c;但情况可能会发生变化……使用Python进行移动应用开发怎么样&#xff1f;从历史上看&#xff0c;在编写移动GUI应用程序时&#xff0c;Python并没有很强的故事。实际上&#xff0c;仅使用纯Pytho…

专业的软件安装包可以这样做!

C/S客户端开发完成&#xff0c;需要将程序交付给用户&#xff0c;直接压缩发给用户是可以的&#xff08;只是有点不专业&#xff09;&#xff0c;如果能有一个比较好看的安装界面&#xff0c;那档次就不一样了。本文介绍怎么使用Adanced Installer 17.9 制作专业的Windows 客户…

jsp需要多少java基础_Java基础——JSP(一)

注意&#xff1a;访问JSP的过程如果是第一次访问服务器&#xff0c;则翻译成一个对应的java文件(Servlet)。然后&#xff0c;再被编成 .class 文件并加载到内存中。如果是以后访问&#xff0c;则直接调用内存中的jsp实例&#xff0c;所以第一次访问慢,以后访问会更加快。四、3种…

宝贝,对不起

宝贝&#xff0c;对不起 题记:读在地震中用生命保护三个月大的婴儿的伟大母亲的遗言 “亲爱的宝贝&#xff0c;如果你能活着&#xff0c;请一定要记得我爱你”有感 谨以此文献给那逝去的伟大母亲和幸存下来坚强的宝贝 ——代腾飞 2008年5月21日 于成都 面对这突如其来的空前灾…

IT人喝酒,不同岗位不同姿势

这是Boss们的常用套路&#xff0c;频频举杯&#xff0c;给大家鼓劲加油&#xff0c;但是自己不喝。有的销售&#xff0c;业绩好&#xff0c;酒品也好&#xff0c;不管和自己人喝酒&#xff0c;还是和客户喝酒&#xff0c;都是一副舍我其谁的霸气&#xff01;这是某些销售的写照…