<！DOCTYPE HTML>
<HTML LANG = "EN">
<ヘッド>
<メタ文字セット= "UTF-8">
<メタ名=「ビューポート」コンテンツ=「幅=装置幅、初期の規模= 1.0」>
<META HTTP-当量= "X-UA-互換性のある" コンテンツ= "IE =エッジ">
<タイトル> </タイトル>ダイヤル
<スタイル>
/ *セットナビゲーション円形の外側のdiv * /
HTML、本体{
幅：100％;
高さ：100％;
背景：＃0c376f。
オーバーフロー：隠されました;
}
.css-変換.menuラッパー{
オーバーフロー：隠されました;
ズーム：1.3;
位置：絶対;
幅：640x460ピクセル。
高さ：640x460ピクセル。
/ *マージン：90PX自動0; * /
-webkitボーダー半径：50％。
-mozボーダー半径：50％。
境界半径：50％。
背景：透明;
ポインタイベント：自動;
マージン：自動;
トップ：0;
右：0;
下：0;
左：0;
}
カバーの内側のラベルに/ *クローズマウスクリックイベントを回避するために、中央の部分* /
/*.css-transforms .menu-ラッパー：{の後に* /
/ *色：透明; * /
/*コンテンツ："。";*/
/*表示ブロック;*/
/ *位置：絶対; * /
/ * z屈折率：10; / *
/ *左：50％; * /
/ *トップ：50％; * /
/ *マージン左：-150px; * /
/ *マージントップ：-150px; * /
/ *幅：300ピクセル; * /
/ *高さ：300ピクセル; * /
/ * - WebKitのボーダー半径：50％; / *
/ * - MOZボーダー半径：50％; / *
/ *境界半径：50％; / *
/ *背景画像：URL（ "../ RFImages /中間円の.png"）; / *
/ *背景サイズ：100％* /
/ * * /}
.css-変換.menu-ラッパーのLi {
位置：絶対;
トップ：-70px;
左：-70px;
オーバーフロー：隠されました;
幅：300ピクセル;
高さ：300ピクセル;
変換起源：100％100％;
ポインタイベント：なし。
}
/ *ラベル抗チルト角 - （90-X）、回転角度-x、xは*、このデモでは、3つのリスト項目は、60の中心角を描き、半円形がある私たちが望む中心角であります/
.css-変換.menu-ラッパーのLi A {
位置：絶対;
右：-200px;
下：-200px;
表示ブロック;
幅：420px;
高さ：420px;
境界半径：50％。
色：#FFF;
テキスト整列：センター;
テキスト装飾：なし;
/ *最初の回転マイターた後、元に戻すことはできません* /
変換：スキュー（-40deg）回転（-66deg）スケール（1）。
ポインタイベント：自動;
}
/ *リストアイテム傾斜角度90-xは、回転角度間隔は順次各リスト項目である> 60 * /
.css-変換.menu-ラッパーのLi：最初の子{
変換：回転（は0deg）スキュー（39deg）。
}
.css-変換.menuラッパーのリチウム：n番目の子（2）{
変換：（51deg）スキュー（39deg）回転。
}
.css-変換.menuラッパーのリチウム：n番目の子（3）{
変換：（102deg）スキュー（39deg）回転。
}
.css-変換.menuラッパーのリチウム：n番目の子（4）{
変換：（153deg）スキュー（39deg）回転。
}
.css-変換.menuラッパーのリチウム：n番目の子（5）{
変換：（205deg）スキュー（39deg）回転。
}
.css-変換.menuラッパーのリチウム：n番目の子（6）{
変換：（256deg）スキュー（39deg）回転。
}
.css-変換.menuラッパーのリチウム：n番目の子（7）{
変換：（307deg）スキュー（39deg）回転。
}
/*.css-transforms .menuラッパーのリチウム：n番目の子（8）{/ *
/ *変換：回転（361deg）スキュー（45deg）; * /
/ * * /}
.css-変換.menu-ラッパーのLi：最初の子IMG {
幅：200pxの。
トップ：-8px。
左：1pxの。
}
.css-変換.menuラッパーのリチウム：n番目の子（7）IMG {
幅：200pxの。
トップ：-8px。
左：7px;
}
IMG {
変換：回転（は0deg）スキュー（は0deg）。
位置：相対;
トップ：-5px;
左：3px;
幅：193px;
}
.menuラッパー{
アニメーション：rot_test 60代無限の直線。
}
.menuラッパー：ホバー{
アニメーションプレイ状態：一時停止中に重要;！
}
@keyframes rot_test {
0％{
変換：回転（は0deg）。
}
100％{
変換：回転（360deg）。
}
}
.centerImage {
色：透明;
コンテンツ："。";
表示ブロック;
位置：絶対;
z屈折率：10。
/ *左：50％; * /
/ *トップ：50％; * /
/ *マージン左：-193px; * /
/ *マージントップ：-198px; * /
幅：390px;
高さ：390px;
-webkitボーダー半径：50％。
-mozボーダー半径：50％。
境界半径：50％。
/ *背景画像：URL（ "../ RFImages /中間円の.png"）; / *
背景画像：のURL（ "../ RFImages /中心の.png"）;
背景サイズ：100％;
マージン：自動;
トップ：0;
右：0;
下：0;
左：0;
}
。ようこそ{
背景：URL（../ RFImages / background2.png）。
背景サイズ：100％100％。
幅：100％;
高さ：100％;
}
.backContBtn {
幅：117px;
高さ：96px;
背景：URL（../../ caseCenter /画像/ backsix.png）。
位置：絶対;
右：3％。
トップ5％;
}
.backContBtn：ホバー{
カーソル：ポインタ;
} </スタイル>
</ head>の
<身体>
<DIV CLASS = "CSS-変換" ID = "箱">
<DIV CLASS = "メニューラッパー">
<メニューwrapperul>
<LI> <a class="first"> <IMGのSRC = "./ IMG / ajgc.png" ALT = "无法显示图片" onclickの= "> </a>の</ LI>
<LI> <a class="first"> <IMG SRC = "./ IMG / sla.png" ALT = "无法显示图片"> </a>の</ LI>
<LI> <a class="first"> <IMGのSRC = "./ IMG / zfcs.png" ALT = "无法显示图片"> </a>の</ LI>
<LI> <a class="first"> <IMGのSRC = "./ IMG / sacw.png" ALT = "无法显示图片"> </a>の</ LI>
<LI> <a class="first"> <IMG SRC = "./ IMG / wja.png" ALT = "无法显示图片"> </a>の</ LI>
<LI> <a class="first"> <IMG SRC = "./ IMG / ajgc.png" ALT = "无法显示图片"> </a>の</ LI>
<LI> <a class="first"> <IMGのSRC = "./ IMG / zfkp.png" ALT = "无法显示图片"> </a>の</ LI>
</メニューwrapperul>
</ div>
</ div>
</ BODY>
</ HTML>