新手指南
完整 DEMO
什么是 MIP
MIP 加速原理
MIP HTML规范
MIP 校验规则
MIP Cache 规范
组件开发规范
Canonical 使用规范
组件概述
组件布局
mip-carousel 多图轮播
mip-iframe
mip-img 图片
mip-pix 统计
mip-video 视频
mip-accordion 折叠节点
mip-anim 动图
mip-appdl 下载
mip-audio 音频播放
mip-filter 筛选
mip-fixed 悬浮布局
mip-form 表单
mip-gototop 快速回顶
mip-html-os 操作系统
mip-lightbox 弹层
mip-link 跳转链接
mip-list 列表组件
mip-nav-slidedown 菜单
mip-share 分享
mip-sidebar 侧边栏
mip-stats-baidu 百度统计
mip-stats-tianrun 天润统计
mip-vd-tabs tab切换组件
mip-ad 广告
类型: ad-baidu 网盟广告
类型: ad-baidu-wm-ext 网盟扩展广告
类型: ad-comm 通用广告
类型: ad-imageplus 图加广告
类型: ad-qwang 全网推荐
类型: ad-ssp 内容联盟广告
开发辅助工具和模块
手势
其它
动画
template 模板
MIP FAQ
个性化组件
广告组件
工具接口
帮助中心
MIP文档手册
一个完整的例子
<!DOCTYPE html>
<html mip>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
<link rel="stylesheet" type="text/css" href="https://mipcache.bdstatic.com/static/v1/mip.css">
<!--TODO: canonical href需要替换成原页面url-->
<link rel="canonical" href="https://m.baidu.com/demo.html">
<title>Hello World</title>
<style mip-custom>
body{margin:10px;}
.red-text { color: red;}
.middle-text { text-align: center;}
.small-pic { max-width: 200px;}
</style>
</head>
<body>
<!--自定义样式-->
<p class="red-text">MIP页支持修改css样式</p>
<p class="middle-text">我是居中的文字</p>
<hr>
<!--图片组件-->
<p class="middle-text"><mip-img> 图片组件</p>
<div class="small-pic">
<mip-img src="https://www.mipengine.org/static/img/mip_logo_3b722d7.png">
<p>图片说明文字</p>
</mip-img>
</div>
<hr>
<!--分享组件-->
<p class="middle-text"><mip-share> 分享组件</p>
<mip-share title="分享：我的第一个MIP页面"></mip-share>
<hr>
<!--百度统计组件 TODO: 修改token值-->
<p class="middle-text"><mip-stats-baidu> 百度统计组件，代码可见</p>
<mip-stats-baidu token="4e397f684261b9e4ff9d8"></mip-stats-baidu>
<!--mip 运行环境-->
<script src="https://mipcache.bdstatic.com/static/v1/mip.js"></script>
<!--分享组件 代码-->
<script src="https://mipcache.bdstatic.com/static/v1/mip-share/mip-share.js"></script>
<!--百度统计组件 代码-->
<script src="https://mipcache.bdstatic.com/static/v1/mip-stats-baidu/mip-stats-baidu.js"></script>
</body>
</html>
<html mip>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
<link rel="stylesheet" type="text/css" href="https://mipcache.bdstatic.com/static/v1/mip.css">
<!--TODO: canonical href需要替换成原页面url-->
<link rel="canonical" href="https://m.baidu.com/demo.html">
<title>Hello World</title>
<style mip-custom>
body{margin:10px;}
.red-text { color: red;}
.middle-text { text-align: center;}
.small-pic { max-width: 200px;}
</style>
</head>
<body>
<!--自定义样式-->
<p class="red-text">MIP页支持修改css样式</p>
<p class="middle-text">我是居中的文字</p>
<hr>
<!--图片组件-->
<p class="middle-text"><mip-img> 图片组件</p>
<div class="small-pic">
<mip-img src="https://www.mipengine.org/static/img/mip_logo_3b722d7.png">
<p>图片说明文字</p>
</mip-img>
</div>
<hr>
<!--分享组件-->
<p class="middle-text"><mip-share> 分享组件</p>
<mip-share title="分享：我的第一个MIP页面"></mip-share>
<hr>
<!--百度统计组件 TODO: 修改token值-->
<p class="middle-text"><mip-stats-baidu> 百度统计组件，代码可见</p>
<mip-stats-baidu token="4e397f684261b9e4ff9d8"></mip-stats-baidu>
<!--mip 运行环境-->
<script src="https://mipcache.bdstatic.com/static/v1/mip.js"></script>
<!--分享组件 代码-->
<script src="https://mipcache.bdstatic.com/static/v1/mip-share/mip-share.js"></script>
<!--百度统计组件 代码-->
<script src="https://mipcache.bdstatic.com/static/v1/mip-stats-baidu/mip-stats-baidu.js"></script>
</body>
</html>
相关视频
24小时阅读榜
精品课程
独孤九贱(2)_CSS视频教程
共22课时
24.3万人学习
独孤九贱(3)_JavaScript视频教程
共28课时
36.2万人学习
独孤九贱(4)_PHP视频教程
共89课时
133.1万人学习
热门下载
phpStudy 2018最新版
集成PHP7，16种组合，超全大合集
下载
vc9-vc14（32+64位）运行库合集（链接在下方）
phpStudy安装所需运行库集合下载
下载
php程序员工具箱完整版
程序员工具箱 v1.0 php集成环境
下载
SublimeText3汉化版
中文版，非常好用
下载
Notepad++ Windows版
Notepad++ 8.9.7 Windows版官方安装包，适合 Windows 用户进行代码编辑、文本处理、语法高亮和插件扩展配置。
下载
phpStudy V8.1（Win64位）（已支持php8）
Win64位，支持php多版本共存
下载