diff --git a/ace/ace_standard/src/main/js/default/pages/input/prop/index.css b/ace/ace_standard/src/main/js/default/pages/input/prop/index.css
index c6f3d1c41e77ba5e9083ae104292153f152d9f0c..59955f16760a067eada01747f87fff3f08a49bfd 100644
--- a/ace/ace_standard/src/main/js/default/pages/input/prop/index.css
+++ b/ace/ace_standard/src/main/js/default/pages/input/prop/index.css
@@ -151,6 +151,26 @@
   padding-end: 10px;
 }
 
+#dataPropB {
+  flex-weight: 1;
+  background-color:#0ff000;
+  width: 100%;
+  margin-left: 10px;
+  margin-right: 10px;
+  padding-start: 10px;
+  padding-end: 10px;
+}
+
+#dataPropBNone {
+  flex-weight: 1;
+  background-color:#00d000;
+  width: 100%;
+  margin-left: 10px;
+  margin-right: 10px;
+  padding-start: 10px;
+  padding-end: 10px;
+}
+
 #dataProp {
   flex-weight: 1;
   background-color:#0ff000;
@@ -341,6 +361,66 @@
   padding-end: 10px;
 }
 
+#showFor1 {
+  flex-weight: 1;
+  background-color:#c00000;
+  width: 100%;
+  margin-left: 10px;
+  margin-right: 10px;
+  padding-start: 10px;
+  padding-end: 10px;
+}
+
+#showFor2 {
+  flex-weight: 1;
+  background-color:blue;
+  width: 100%;
+  margin-left: 10px;
+  margin-right: 10px;
+  padding-start: 10px;
+  padding-end: 10px;
+}
+
+#showIf {
+  flex-weight: 1;
+  background-color:#c00000;
+  width: 100%;
+  margin-left: 10px;
+  margin-right: 10px;
+  padding-start: 10px;
+  padding-end: 10px;
+}
+
+#showElseIfTrue {
+  flex-weight: 1;
+  background-color:black;
+  width: 100%;
+  margin-left: 10px;
+  margin-right: 10px;
+  padding-start: 10px;
+  padding-end: 10px;
+}
+
+#showElseIfFalse {
+  flex-weight: 1;
+  background-color:blue;
+  width: 100%;
+  margin-left: 10px;
+  margin-right: 10px;
+  padding-start: 10px;
+  padding-end: 10px;
+}
+
+#showElse {
+  flex-weight: 1;
+  background-color:yellow;
+  width: 100%;
+  margin-left: 10px;
+  margin-right: 10px;
+  padding-start: 10px;
+  padding-end: 10px;
+}
+
 .specific-container{
   flex-direction: column;
   flex-weight: 1;
diff --git a/ace/ace_standard/src/main/js/default/pages/input/prop/index.hml b/ace/ace_standard/src/main/js/default/pages/input/prop/index.hml
index a5b14b2d8e19d3942156aa25691f240f279c8bb9..dbcaee0b751b62b75910a60dbbe810fd57af3939 100644
--- a/ace/ace_standard/src/main/js/default/pages/input/prop/index.hml
+++ b/ace/ace_standard/src/main/js/default/pages/input/prop/index.hml
@@ -79,6 +79,16 @@
              focusable="">
         </input>
 
+        <text class="sub-title">
+            通用属性 -- data
+        </text>
+        <input id="dataPropB"
+               data-input="通用属性 -- data">
+        </input>
+        <input id="dataPropBNone"
+               data-input="">
+        </input>
+
         <text class="sub-title">
             通用属性 -- data-*
         </text>
@@ -411,5 +421,22 @@
                showpasswordicon=""
                type="password">
         </input>
+        <text class="sub-title">
+            特有属性 -- tid
+        </text>
+        <input for="{{array}}" tid="id" style="color: #679855; margin: 1px;"
+               id="showFor{{$item.id}}" value="{{$item.name }}">
+        </input>
+        <text class="sub-title">
+            特有属性 -- if elif
+        </text>
+        <input if="false" id="showIf">
+        </input>
+        <input elif="false" id="showElseIfTrue">
+        </input>
+        <input elif="true" id="showElseIfFalse">
+        </input>
+        <input else id="showElse">
+        </input>
     </div>
 </div>
diff --git a/ace/ace_standard/src/main/js/default/pages/input/prop/index.js b/ace/ace_standard/src/main/js/default/pages/input/prop/index.js
index c11144a6d6311cb58bae420da8fcf87fa6d8f6cb..bb118fc6da34a9432491121275ea4e3fdbd52bc1 100644
--- a/ace/ace_standard/src/main/js/default/pages/input/prop/index.js
+++ b/ace/ace_standard/src/main/js/default/pages/input/prop/index.js
@@ -17,6 +17,10 @@ import prompt from '@system.prompt';
 
 export default {
     data:{
+        array: [
+            {id: 1, name: 'jack', age: 18},
+            {id: 2, name: 'tony', age: 18},
+        ],
         listOne:[{}],
         listThree:[{},{},{}],
         idProp : null,
diff --git a/ace/ace_standard/src/main/js/default/pages/input/router/index.css b/ace/ace_standard/src/main/js/default/pages/input/router/index.css
index 1288600b2887f51b9fd1989435dfe454fd3e3285..dd9617bcbac863123f73757bbab03c2c9706ed1c 100644
--- a/ace/ace_standard/src/main/js/default/pages/input/router/index.css
+++ b/ace/ace_standard/src/main/js/default/pages/input/router/index.css
@@ -317,6 +317,7 @@
   width: 100%;
   flex-weight: 1;
   overflow:scroll;
+  background-color: blue;
 }
 
 .prop-container{
diff --git a/ace/ace_standard/src/main/js/default/pages/input/router/index.hml b/ace/ace_standard/src/main/js/default/pages/input/router/index.hml
index 01835d3bb1f2c13e7d8782376310a0085b9bc80c..221e11528bf41ba7655a8dde2b3826d2cad908f3 100644
--- a/ace/ace_standard/src/main/js/default/pages/input/router/index.hml
+++ b/ace/ace_standard/src/main/js/default/pages/input/router/index.hml
@@ -113,14 +113,14 @@
                 input通用属性2
             </text>
             <input class="prop2" ref ="prop2" id="prop2"
-                 disabled = "false" focusable ="false"
-                 data-name ="prop2" click-effect="spring-large"
-                 dir ="ltr">
+                   disabled = "false" focusable ="false"
+                   data-name ="prop2" click-effect="spring-large"
+                   dir ="ltr">
             </input>
             <text  class="sub-title">
                 input通用属性3
             </text>
-            <input style="color: #679855; margin: 5px;" class="prop3" id="prop3">
+            <input style="color: #679855; margin: 1px;" class="prop3" id="prop3">
             </input>
             <text  class="sub-title">
                 input特有属性1
@@ -153,6 +153,16 @@
                    softkeyboardenabled="true"
                    showpasswordicon="false">
             </input>
+            <div style="margin: 1px;">
+                <input if="false" class="prop2" ref ="prop2" style="background-color: rebeccapurple;">
+                </input>
+                <input elif="true" class="prop2" ref ="prop2" style="background-color: black;">
+                </input>
+                <input elif="false" class="prop2" ref ="prop2" style="background-color: blue;">
+                </input>
+                <input else class="prop2" ref ="prop2" style="background-color: yellow;">
+                </input>
+            </div>
 
             <text  class="sub-title">
                 input特有属性3
@@ -161,6 +171,9 @@
                    type="password"
                    showpasswordicon="true">
             </input>
+            <input for="{{array}}" tid="id" style="color: #679855; margin: 1px;" class="prop3"
+                   value="{{$item.name }}">
+            </input>
         </div>
         <div style="background-color: #000000; width: 100%; height: 2px;">
         </div>
@@ -210,7 +223,8 @@
             </text>
             <input class ="event5" 
                     type="checkbox"
-                   onchange="checkChange">
+                   onchange="checkChange"
+                   onaccessibility="accessibility">
             </input>
         </div>
         <div style="background-color: #000000; width: 100%; height: 2px;">
diff --git a/ace/ace_standard/src/main/js/default/pages/input/router/index.js b/ace/ace_standard/src/main/js/default/pages/input/router/index.js
index 77a14a11da1b8866a7edc315ad3c1a88106c802b..26f025dc927d0ae038cc75476aa3fa8d803a3181 100644
--- a/ace/ace_standard/src/main/js/default/pages/input/router/index.js
+++ b/ace/ace_standard/src/main/js/default/pages/input/router/index.js
@@ -84,6 +84,12 @@ var frames = [
 ];
 
 export default {
+    data: {
+        array: [
+            {id: 1, name: 'jack', age: 18},
+            {id: 2, name: 'tony', age: 18},
+        ],
+    },
 
     onShow(){
         // 通用属性
@@ -506,5 +512,11 @@ export default {
         prompt.showToast({
             message: JSON.stringify(event)
         });
+    },
+
+    accessibility(event){
+        prompt.showToast({
+            message: JSON.stringify(event)
+        });
     }
 }
diff --git a/ace/ace_standard/src/main/js/default/pages/input/style/index.css b/ace/ace_standard/src/main/js/default/pages/input/style/index.css
index 7fb4e731a9d50eb33d853067e1573308171532a2..c91d87811f6192cb2dc753aeef5517d7ea9c1552 100644
--- a/ace/ace_standard/src/main/js/default/pages/input/style/index.css
+++ b/ace/ace_standard/src/main/js/default/pages/input/style/index.css
@@ -340,6 +340,7 @@
   background-size:10% 20%;
   background-repeat: repeat;
   background-position: 30% 40%;
+  mask-image:linear-gradient(pink,#fff000);
 }
 
 #styleThirtyTwo{
@@ -467,3 +468,240 @@
   placeholder-color: red;
 }
 
+#addOne{
+  width: 10%;
+  height: 20px;
+  background-image:url('common/images/image.png');
+  background-size:cover;
+  align-self:stretch;
+  position:fixed;
+  transform: none;
+  animation-timing-function:cubic-bezier(0.4, 0.0, 0.4, 1.0);
+  shared-transition-effect:static;
+  shared-transition-name:ani;
+  shared-transition-timing-function:friction;
+  transition-enter:ani;
+  transition-exit: ani;
+  transition-duration:10;
+  transition-timing-function:friction;
+  clip-path:border-box;
+  display-index:1;
+  filter:blur(10px);
+  backdrop-filter:blur(10px);
+  window-filter:blur(10%);
+}
+
+#addTwo{
+  width: 100px;
+  height: 15px;
+  background-image:url('common/images/image.png');
+  background-size:auto;
+  position:relative;
+  transform: matrix(0.5,0.1,0.2,0.9,20,10);
+  animation-timing-function:steps(4);
+  shared-transition-effect:exchange;
+  clip-path:padding-box;
+}
+
+#addThree{
+  width: 100px;
+  height: 15px;
+  background-color:#000000;
+  transform: matrix3d(1,2,1,2,1,2,1,2,1,2,1,2,1,2,1,2);
+  clip-path:content-box;
+}
+
+#addFour{
+  width: 100px;
+  height: 15px;
+  background-color:#000000;
+  transform: translate3d(1px,2px,1px) scale3d(1,2,1) rotate3d(10,10,10,10deg) skew(1deg,2deg) perspective(10px);
+  clip-path:circle(1);
+}
+
+#addFive{
+  width: 100px;
+  height: 15px;
+  background-color: #000000;
+  transform: translateY(1px) translateZ(10px)
+  scale(1,2) scaleZ(0.4)
+  rotateX(10deg) rotateY(10deg) rotateZ(10deg)
+  skewX(1deg) skewY(2deg);
+  clip-path:ellipse(1);
+}
+
+#addSix{
+  width: 100px;
+  height: 15px;
+  background-color: #000000;
+  transform: scaleX(1) scaleY(0.4);
+  clip-path:ellipse(1)
+}
+
+#addSeven{
+  width: 100px;
+  height: 15px;
+  background-color: #000000;
+  clip-path:path(1);
+  aspect-ratio:2;
+}
+
+#addSeven:disabled{
+  width: 100px;
+  height: 15px;
+  background-color: #ff0000;
+}
+
+#addSeven:active{
+  width: 100px;
+  height: 15px;
+  background-color: #ff0000;
+}
+
+#addSeven:focus{
+  width: 100px;
+  height: 15px;
+  background-color: #ff0000;
+}
+
+#addEight_1{
+  width: 100px;
+  height: 30px;
+  background-color:red;
+  font-size: 20px;
+  color: white;
+  font-weight: lighter;
+  radius: 100px;
+}
+#addEight_2{
+  width: 100px;
+  height: 30px;
+  background-color:red;
+  font-size: 20px;
+  color: white;
+  font-weight: normal;
+}
+#addEight_3{
+  width: 100px;
+  height: 30px;
+  background-color:red;
+  font-size: 20px;
+  color: white;
+  font-weight: bold;
+}
+#addEight_4{
+  width: 100px;
+  height: 30px;
+  background-color:red;
+  font-size: 20px;
+  color: white;
+  font-weight: bolder;
+}
+#addEight_5{
+  width: 100px;
+  height: 30px;
+  background-color:red;
+  font-size: 20px;
+  color: white;
+  font-weight: medium;
+}
+#addEight_6{
+  width: 100px;
+  height: 30px;
+  background-color:red;
+  font-size: 20px;
+  color: white;
+  font-weight: regular;
+}
+#addEight_7{
+  width: 100px;
+  height: 30px;
+  background-color:red;
+  font-size: 20px;
+  color: white;
+  font-weight: 100;
+}
+#addEight_8{
+  width: 100px;
+  height: 30px;
+  background-color:red;
+  font-size: 20px;
+  color: white;
+  font-weight: 200;
+}
+#addEight_9{
+  width: 100px;
+  height: 30px;
+  background-color:red;
+  font-size: 20px;
+  color: white;
+  font-weight: 300;
+}
+#addEight_10{
+  width: 100px;
+  height: 30px;
+  background-color:red;
+  font-size: 20px;
+  color: white;
+  font-weight: 400;
+}
+#addEight_11{
+  width: 100px;
+  height: 30px;
+  background-color:red;
+  font-size: 20px;
+  color: white;
+  font-weight: 500;
+}
+#addEight_12{
+  width: 100px;
+  height: 30px;
+  background-color:red;
+  font-size: 20px;
+  color: white;
+  font-weight: 600;
+}
+#addEight_13{
+  width: 100px;
+  height: 30px;
+  background-color:red;
+  font-size: 20px;
+  color: white;
+  font-weight: 700;
+  text-align: right;
+}
+#addEight_14{
+  width: 100px;
+  height: 30px;
+  background-color:red;
+  font-size: 20px;
+  color: white;
+  font-weight: 800;
+  font-variant: normal;
+  text-align: start;
+}
+#addEight_15{
+  width: 100px;
+  height: 30px;
+  background-color:red;
+  font-size: 20px;
+  color: white;
+  font-weight: 900;
+  font-variant: none;
+  text-align: end;
+}
+
+@font-face {
+  font-family: SimSunfont;
+  src: url('/common/simsun.ttf');
+}
+
+@media (device-type: tv) {
+  .addSeven {
+    width: 500px;
+    height: 500px;
+    background-color: #fa8072;
+  }
+}
+
+
diff --git a/ace/ace_standard/src/main/js/default/pages/input/style/index.hml b/ace/ace_standard/src/main/js/default/pages/input/style/index.hml
index ced40937a282bc4dd8b91718696a5da145bafa1e..6599196e64eb19dace96f63200199557d4536982 100644
--- a/ace/ace_standard/src/main/js/default/pages/input/style/index.hml
+++ b/ace/ace_standard/src/main/js/default/pages/input/style/index.hml
@@ -168,6 +168,65 @@
             <input id="specificCaretColor2" class="caret-color2">
             </input>
         </div>
+        <div style="width: 100%;flex-weight: 1;overflow: scroll;flex-direction: column;">
+            <text class="sub-title">
+                补充样式
+            </text>
+            <input id="addOne">
+            </input>
+            <input id="addTwo">
+            </input>
+            <input id="addThree">
+            </input>
+            <input id="addFour">
+            </input>
+            <input id="addFive">
+            </input>
+            <input id="addSix">
+            </input>
+            <input id="addSeven">
+            </input>
+            <div>
+                <input id="addEight_1" value="value">
+                </input>
+                <input id="addEight_2" value="value">
+                </input>
+                <input id="addEight_3" value="value">
+                </input>
+            </div>
+            <div>
+                <input id="addEight_4" value="value">
+                </input>
+                <input id="addEight_5" value="value">
+                </input>
+                <input id="addEight_6" value="value">
+                </input>
+            </div>
+            <div>
+                <input id="addEight_7" value="value">
+                </input>
+                <input id="addEight_8" value="value">
+                </input>
+                <input id="addEight_9" value="value">
+                </input>
+            </div>
+            <div>
+                <input id="addEight_10" value="value">
+                </input>
+                <input id="addEight_11" value="value">
+                </input>
+                <input id="addEight_12" value="value">
+                </input>
+            </div>
+            <div>
+                <input id="addEight_13" value="value">
+                </input>
+                <input id="addEight_14" value="value">
+                </input>
+                <input id="addEight_15" value="value">
+                </input>
+            </div>
+        </div>
     </div>
 </div>