Aliplayer皮肤设置分为HTML5模式与Flash模式。通过阅读本文，了解如何设置播放器皮肤。
HTML5播放器皮肤设置
默认设置：页面引入文件。
<link rel="stylesheet" href="https://g.alicdn.com/apsara-media-box/imp-web-player/{SDK版本号}/skins/default/aliplayer-min.css" />css文件中包含皮肤素材：http://gw.alicdn.com/tps/TB1YuE3KFXXXXaAXFXXXXXXXXXX-256-512.png
配置信息：内部组件都要有配置。
名称 | 说明 |
prism-player | 播放器配置 |
prism-big-play-btn | 大播放按钮 |
prism-play-btn | 播放按钮 |
prism-play-btn.playing | 播放过程中暂停 |
prism-live-display | 直播图标（直播时会占用播放按钮位置） |
prism-fullscreen-btn | 全屏按钮 |
prism-fullscreen-btn.fullscreen | 全屏后按钮 |
prism-volume | 声音按钮 |
prism-volume.mute | 静音后按钮 |
prism-cover | 播放器开始前封面配置 |
prism-controlbar | 播放器控制栏 |
prism-time-display | 时间显示总时间 |
prism-time-display .current-time | 当前时间 |
prism-progress | 进度条 |
prism-progress-loaded | 加载进度 |
prism-progress-cursor | 进度条位置 |
prism-speed-selector | 倍速播放 |
prism-stream-selector | 清晰度切换 |
prism-snapshot-btn | 截图按钮 |
prism-ErrorMessage | 错误显示 |
prism-info-display | 信息显示 |
配置方式
具体可以参照播放器的CSS配置文件：aliplayer-min.css
例如大播放按钮，示例代码如下：
.prism-player .prism-big-play-btn {
width: 90px;
height: 90px;
background: url("//gw.alicdn.com/tps/TB1YuE3KFXXXXaAXFXXXXXXXXXX-256-512.png") no-repeat -2px -2px;
}示例代码参数说明如下：
参数 | 说明 |
width | 宽度，单位：px（像素） |
height | 高度，单位：px（像素） |
background | 图像URL |
no-repeat | 不平铺（同css） |
-2px | x轴位置，y轴位置 |
Flash播放器皮肤设置
默认使用文件
http://g.alicdn.com/de/prismplayer-flash/{SDK版本号}/atlas/defaultSkin.xml
http://g.alicdn.com/de/prismplayer-flash/{SDK版本号}/atlas/defaultSkin.png.png文件为皮肤按钮素材，.xml文件指定皮肤按钮位置。
播放器默认在http://g.alicdn.com/de/prismplayer-flash/{SDK版本号}/atlas/目录下查找defaultSkin.xml与defaultSkin.png文件。
配置信息
设定元件素材图像：
<TextureAtlas imagePath="defaultSkin.png">设定元件：
名称 | 说明 |
bigPlayDown | 大播放按钮，点击后的图标 |
bigPlayOver | 大播放按钮，鼠标划过时图标 |
bigPlayUp | 大播放按钮，未点击时图标 |
clarityBgDown | 清晰度标示，点击后图标 |
clarityBgOver | 清晰度标示，鼠标划过时图标 |
clarityBgUp | 清晰度标示，未点击时图标 |
followDisabled | 下一条按钮，禁止时图标 |
followDown | 下一条按钮，点击后图标 |
followOver | 下一条按钮，鼠标划过时图标 |
followUp | 下一条按钮，未点击时图标 |
fullScreenDisabled | 全屏按钮，禁止时图标 |
fullScreenDown | 全屏按钮，点击后图标 |
fullScreenOver | 全屏按钮，鼠标划过时图标 |
fullScreenUp | 全屏按钮，未点击时图标 |
liveicon | 直播标志图片 |
muteDown | 静音按钮，点击后图标 |
muteOver | 静音按钮，鼠标划过时图标 |
muteUp | 静音按钮，未点击时图标 |
normalScreenDown | 退出全屏按钮，点击后图标 |
normalScreenOver | 退出全屏按钮，鼠标划过时图标 |
normalScreenUp | 退出全屏按钮，未点击时图标 |
pauseDisabled | 暂停按钮，禁止时图标 |
pauseDown | 暂停按钮，点击后图标 |
pauseOver | 暂停按钮，鼠标划过时图标 |
pauseUp | 暂停按钮，未点击时图标 |
playDisabled | 播放按钮，禁止时图标 |
playDown | 播放按钮，点击后图标 |
playOver | 播放按钮，鼠标划过时图标 |
playUp | 播放按钮，未点击时图标 |
replayDown | 重播按钮，点击后图标 |
replayOver | 重播按钮，鼠标划过时图标 |
replayUp | 重播按钮，未点击时图标 |
setDown | 设置按钮，点击后图标 |
setOver | 设置按钮，鼠标划过时图标 |
setUp | 设置按钮，未点击时图标 |
volMaxDown | 大声音（>=50%），点击后图标 |
volMaxOver | 大声音（>=50%），鼠标划过时图标 |
volMaxUp | 大声音（>=50%），未点击时图标 |
volMinDown | 小声音（<50%），点击后图标 |
volMinOver | 小声音（<50%），鼠标划过时图标 |
volMinUp | 小声音（<50%），未点击时图标 |
zoom100Down | 全屏时100%比例按钮，点击后图标 |
zoom100Over | 全屏时100%比例按钮，鼠标划过时图标 |
zoom100Up | 全屏时100%比例按钮，未点击时图标 |
zoom75Down | 全屏时75%比例按钮，点击后图标 |
zoom75Over | 全屏时75%比例按钮，鼠标划过时图标 |
zoom75Up | 全屏时75%比例按钮，未点击时图标 |
zoom50Down | 全屏时50%比例按钮，点击后图标 |
zoom50Over | 全屏时50%比例按钮，鼠标划过时图标 |
zoom50Up | 全屏时50%比例按钮，未点击时图标 |
配置方式
参照默认皮肤设置，在http://[domain]/[path]/目录下存放skin.png与skin.xml文件，并在player的输入参数中添加skinRes："http://domain/path/skin"。
例如大播放按钮，示例代码如下：
<SubTexture name="bigPlayDown" x="2" y="94" width="90" height="90"/>
<SubTexture name="bigPlayOver" x="94" y="2" width="90" height="90"/>
<SubTexture name="bigPlayUp" x="2" y="2" width="90" height="90"/>示例代码参数说明如下：
参数 | 说明 |
x | 元件在图像中x轴坐标 |
y | 元件在图像中y轴坐标 |
width | 元件在图像中宽度 |
height | 元件在图像中高度 |