移动web开发基础

最新推荐文章于 2023-06-07 10:19:11 发布

Satosere

最新推荐文章于 2023-06-07 10:19:11 发布

阅读量212

点赞数

文章标签： css html5 html css3

本文链接：https://blog.csdn.net/Satosere/article/details/112525583

版权

本文探讨了移动Web开发的基础，包括针对移动端浏览器的webkit兼容性处理，CSS3和H5的应用，CSS初始化 normalize.css 的使用，以及特殊样式如CSS3盒子模型、透明点击效果和UI定制。

摘要由CSDN通过智能技术生成

移动web开发基础

文章目录

移动web开发基础
前言
三、移动端技术解决方案
- 3.1 移动端浏览器

前言

三、移动端技术解决方案

3.1 移动端浏览器

移动端浏览器基本以 webkit 内核为主，因此就考虑webkit兼容性问题。

放心使用 H5 标签和 CSS3 样式

浏览器的私有前缀只需要考虑添加webkit 即可

3.2 CSS初始化 `normalize.css`

官网地址： http://necolas.github.io/normalize.css/

body {
	margin: 0 auto;
	min-width: 320px;
	max-width: 640px;
	background: #fff;
	font-size: 14px;
	font-family: -apple-system, Helvetica, sans-serif;
	line-height: 1.5;
	color: #666;
}

3.3 特殊样式

	/*CSS3盒子模型*/
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	
	/*点击高亮我们需要清除清除 设置为transparent 完成透明*/
	-webkit-tap-highlight-color: transparent;
	
	/*在移动端浏览器默认的外观在iOS上加上这个属性才能给按钮和输入框自定义样式*/
	-webkit-appearance: none;
	
	/*禁用长按页面时的弹出菜单*/
	img,a { -webkit-touch-callout: none; }