下面的样式就是样式表中所有可用的属性。
<code class="hljs bash has-numbering" style="display: block; padding: 0px; background-color: transparent; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; word-wrap: normal; background-position: initial initial; background-repeat: initial initial;"><span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"alignItems"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"alignSelf"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"backfaceVisibility"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"backgroundColor"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"borderBottomColor"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"borderBottomLeftRadius"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"borderBottomRightRadius"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"borderBottomWidth"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"borderColor"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"borderLeftColor"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"borderLeftWidth"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"borderRadius"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"borderRightColor"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"borderRightWidth"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"borderStyle"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"borderTopColor"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"borderTopLeftRadius"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"borderTopRightRadius"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"borderTopWidth"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"borderWidth"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"bottom"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"color"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"flex"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"flexDirection"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"flexWrap"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"fontFamily"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"fontSize"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"fontStyle"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"fontWeight"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"height"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"justifyContent"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"left"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"letterSpacing"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"lineHeight"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"margin"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"marginBottom"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"marginHorizontal"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"marginLeft"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"marginRight"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"marginTop"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"marginVertical"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"opacity"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"overflow"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"padding"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"paddingBottom"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"paddingHorizontal"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"paddingLeft"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"paddingRight"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"paddingTop"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"paddingVertical"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"position"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"resizeMode"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"right"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"rotation"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"scaleX"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"scaleY"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"shadowColor"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"shadowOffset"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"shadowOpacity"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"shadowRadius"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"textAlign"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"textDecorationColor"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"textDecorationLine"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"textDecorationStyle"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"tintColor"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"top"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"transform"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"transformMatrix"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"translateX"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"translateY"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"width"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"writingDirection"</span></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li><li style="box-sizing: border-box; padding: 0px 5px;">6</li><li style="box-sizing: border-box; padding: 0px 5px;">7</li><li style="box-sizing: border-box; padding: 0px 5px;">8</li><li style="box-sizing: border-box; padding: 0px 5px;">9</li><li style="box-sizing: border-box; padding: 0px 5px;">10</li><li style="box-sizing: border-box; padding: 0px 5px;">11</li><li style="box-sizing: border-box; padding: 0px 5px;">12</li><li style="box-sizing: border-box; padding: 0px 5px;">13</li><li style="box-sizing: border-box; padding: 0px 5px;">14</li><li style="box-sizing: border-box; padding: 0px 5px;">15</li><li style="box-sizing: border-box; padding: 0px 5px;">16</li><li style="box-sizing: border-box; padding: 0px 5px;">17</li><li style="box-sizing: border-box; padding: 0px 5px;">18</li><li style="box-sizing: border-box; padding: 0px 5px;">19</li><li style="box-sizing: border-box; padding: 0px 5px;">20</li><li style="box-sizing: border-box; padding: 0px 5px;">21</li><li style="box-sizing: border-box; padding: 0px 5px;">22</li><li style="box-sizing: border-box; padding: 0px 5px;">23</li><li style="box-sizing: border-box; padding: 0px 5px;">24</li><li style="box-sizing: border-box; padding: 0px 5px;">25</li><li style="box-sizing: border-box; padding: 0px 5px;">26</li><li style="box-sizing: border-box; padding: 0px 5px;">27</li><li style="box-sizing: border-box; padding: 0px 5px;">28</li><li style="box-sizing: border-box; padding: 0px 5px;">29</li><li style="box-sizing: border-box; padding: 0px 5px;">30</li><li style="box-sizing: border-box; padding: 0px 5px;">31</li><li style="box-sizing: border-box; padding: 0px 5px;">32</li><li style="box-sizing: border-box; padding: 0px 5px;">33</li><li style="box-sizing: border-box; padding: 0px 5px;">34</li><li style="box-sizing: border-box; padding: 0px 5px;">35</li><li style="box-sizing: border-box; padding: 0px 5px;">36</li><li style="box-sizing: border-box; padding: 0px 5px;">37</li><li style="box-sizing: border-box; padding: 0px 5px;">38</li><li style="box-sizing: border-box; padding: 0px 5px;">39</li><li style="box-sizing: border-box; padding: 0px 5px;">40</li><li style="box-sizing: border-box; padding: 0px 5px;">41</li><li style="box-sizing: border-box; padding: 0px 5px;">42</li><li style="box-sizing: border-box; padding: 0px 5px;">43</li><li style="box-sizing: border-box; padding: 0px 5px;">44</li><li style="box-sizing: border-box; padding: 0px 5px;">45</li><li style="box-sizing: border-box; padding: 0px 5px;">46</li><li style="box-sizing: border-box; padding: 0px 5px;">47</li><li style="box-sizing: border-box; padding: 0px 5px;">48</li><li style="box-sizing: border-box; padding: 0px 5px;">49</li><li style="box-sizing: border-box; padding: 0px 5px;">50</li><li style="box-sizing: border-box; padding: 0px 5px;">51</li><li style="box-sizing: border-box; padding: 0px 5px;">52</li><li style="box-sizing: border-box; padding: 0px 5px;">53</li><li style="box-sizing: border-box; padding: 0px 5px;">54</li><li style="box-sizing: border-box; padding: 0px 5px;">55</li><li style="box-sizing: border-box; padding: 0px 5px;">56</li><li style="box-sizing: border-box; padding: 0px 5px;">57</li><li style="box-sizing: border-box; padding: 0px 5px;">58</li><li style="box-sizing: border-box; padding: 0px 5px;">59</li><li style="box-sizing: border-box; padding: 0px 5px;">60</li><li style="box-sizing: border-box; padding: 0px 5px;">61</li><li style="box-sizing: border-box; padding: 0px 5px;">62</li><li style="box-sizing: border-box; padding: 0px 5px;">63</li><li style="box-sizing: border-box; padding: 0px 5px;">64</li><li style="box-sizing: border-box; padding: 0px 5px;">65</li><li style="box-sizing: border-box; padding: 0px 5px;">66</li><li style="box-sizing: border-box; padding: 0px 5px;">67</li><li style="box-sizing: border-box; padding: 0px 5px;">68</li><li style="box-sizing: border-box; padding: 0px 5px;">69</li><li style="box-sizing: border-box; padding: 0px 5px;">70</li><li style="box-sizing: border-box; padding: 0px 5px;">71</li><li style="box-sizing: border-box; padding: 0px 5px;">72</li></ul><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li><li style="box-sizing: border-box; padding: 0px 5px;">6</li><li style="box-sizing: border-box; padding: 0px 5px;">7</li><li style="box-sizing: border-box; padding: 0px 5px;">8</li><li style="box-sizing: border-box; padding: 0px 5px;">9</li><li style="box-sizing: border-box; padding: 0px 5px;">10</li><li style="box-sizing: border-box; padding: 0px 5px;">11</li><li style="box-sizing: border-box; padding: 0px 5px;">12</li><li style="box-sizing: border-box; padding: 0px 5px;">13</li><li style="box-sizing: border-box; padding: 0px 5px;">14</li><li style="box-sizing: border-box; padding: 0px 5px;">15</li><li style="box-sizing: border-box; padding: 0px 5px;">16</li><li style="box-sizing: border-box; padding: 0px 5px;">17</li><li style="box-sizing: border-box; padding: 0px 5px;">18</li><li style="box-sizing: border-box; padding: 0px 5px;">19</li><li style="box-sizing: border-box; padding: 0px 5px;">20</li><li style="box-sizing: border-box; padding: 0px 5px;">21</li><li style="box-sizing: border-box; padding: 0px 5px;">22</li><li style="box-sizing: border-box; padding: 0px 5px;">23</li><li style="box-sizing: border-box; padding: 0px 5px;">24</li><li style="box-sizing: border-box; padding: 0px 5px;">25</li><li style="box-sizing: border-box; padding: 0px 5px;">26</li><li style="box-sizing: border-box; padding: 0px 5px;">27</li><li style="box-sizing: border-box; padding: 0px 5px;">28</li><li style="box-sizing: border-box; padding: 0px 5px;">29</li><li style="box-sizing: border-box; padding: 0px 5px;">30</li><li style="box-sizing: border-box; padding: 0px 5px;">31</li><li style="box-sizing: border-box; padding: 0px 5px;">32</li><li style="box-sizing: border-box; padding: 0px 5px;">33</li><li style="box-sizing: border-box; padding: 0px 5px;">34</li><li style="box-sizing: border-box; padding: 0px 5px;">35</li><li style="box-sizing: border-box; padding: 0px 5px;">36</li><li style="box-sizing: border-box; padding: 0px 5px;">37</li><li style="box-sizing: border-box; padding: 0px 5px;">38</li><li style="box-sizing: border-box; padding: 0px 5px;">39</li><li style="box-sizing: border-box; padding: 0px 5px;">40</li><li style="box-sizing: border-box; padding: 0px 5px;">41</li><li style="box-sizing: border-box; padding: 0px 5px;">42</li><li style="box-sizing: border-box; padding: 0px 5px;">43</li><li style="box-sizing: border-box; padding: 0px 5px;">44</li><li style="box-sizing: border-box; padding: 0px 5px;">45</li><li style="box-sizing: border-box; padding: 0px 5px;">46</li><li style="box-sizing: border-box; padding: 0px 5px;">47</li><li style="box-sizing: border-box; padding: 0px 5px;">48</li><li style="box-sizing: border-box; padding: 0px 5px;">49</li><li style="box-sizing: border-box; padding: 0px 5px;">50</li><li style="box-sizing: border-box; padding: 0px 5px;">51</li><li style="box-sizing: border-box; padding: 0px 5px;">52</li><li style="box-sizing: border-box; padding: 0px 5px;">53</li><li style="box-sizing: border-box; padding: 0px 5px;">54</li><li style="box-sizing: border-box; padding: 0px 5px;">55</li><li style="box-sizing: border-box; padding: 0px 5px;">56</li><li style="box-sizing: border-box; padding: 0px 5px;">57</li><li style="box-sizing: border-box; padding: 0px 5px;">58</li><li style="box-sizing: border-box; padding: 0px 5px;">59</li><li style="box-sizing: border-box; padding: 0px 5px;">60</li><li style="box-sizing: border-box; padding: 0px 5px;">61</li><li style="box-sizing: border-box; padding: 0px 5px;">62</li><li style="box-sizing: border-box; padding: 0px 5px;">63</li><li style="box-sizing: border-box; padding: 0px 5px;">64</li><li style="box-sizing: border-box; padding: 0px 5px;">65</li><li style="box-sizing: border-box; padding: 0px 5px;">66</li><li style="box-sizing: border-box; padding: 0px 5px;">67</li><li style="box-sizing: border-box; padding: 0px 5px;">68</li><li style="box-sizing: border-box; padding: 0px 5px;">69</li><li style="box-sizing: border-box; padding: 0px 5px;">70</li><li style="box-sizing: border-box; padding: 0px 5px;">71</li><li style="box-sizing: border-box; padding: 0px 5px;">72</li></ul>
边框宽度
<code class="hljs cs has-numbering" style="display: block; padding: 0px; background-color: transparent; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; word-wrap: normal; background-position: initial initial; background-repeat: initial initial;">borderBottomWidth <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//底部边框宽度</span> borderLeftWidth <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//左边边框宽度</span> borderRightWidth <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//右边边框宽度</span> borderTopWidth <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//顶部边框宽度</span> borderWidth <span class="hljs-comment" style="color: rgb(136, 0, 0); box-sizing: border-box;">//所有边框宽度</span></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li></ul><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li></ul>
边框颜色
同边框宽度属性，属性值为字符串类型的rgb表示方式
<code class="hljs has-numbering" style="display: block; padding: 0px; background-color: transparent; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; word-wrap: normal; background-position: initial initial; background-repeat: initial initial;">borderBottomColor borderLeftColor borderRightColor borderTopColor borderColor</code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li></ul><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li><li></li></ul>
外边距
<code class="hljs scss has-numbering" style="display: block; padding: 0px; background-color: transparent; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; word-wrap: normal; background-position: initial initial; background-repeat: initial initial;">marginBottom marginLeft marginRight marginTop marginVertical marginHorizontal <span class="hljs-attribute" style="box-sizing: border-box;">margin</span></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li><li style="box-sizing: border-box; padding: 0px 5px;">6</li><li style="box-sizing: border-box; padding: 0px 5px;">7</li></ul><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li><li style="box-sizing: border-box; padding: 0px 5px;">6</li><li style="box-sizing: border-box; padding: 0px 5px;">7</li></ul>
值得注意的是marginVertical相当于同时设置marginTop和marginBottom，marginHorizontal相当于同时设置marginLeft和marginRight，margin相当于同时设置四个
内边距
<code class="hljs scss has-numbering" style="display: block; padding: 0px; background-color: transparent; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; word-wrap: normal; background-position: initial initial; background-repeat: initial initial;">paddingBottom paddingLeft paddingRight paddingTop paddingVertical paddingHorizontal <span class="hljs-attribute" style="box-sizing: border-box;">padding</span> </code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li><li style="box-sizing: border-box; padding: 0px 5px;">6</li><li style="box-sizing: border-box; padding: 0px 5px;">7</li></ul><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li><li style="box-sizing: border-box; padding: 0px 5px;">6</li><li style="box-sizing: border-box; padding: 0px 5px;">7</li></ul>
背景色
背景色，属性值为字符串类型的rgb表示方式，可以设置‘transparent’之类的属性
<code class="hljs has-numbering" style="display: block; padding: 0px; background-color: transparent; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; word-wrap: normal; background-position: initial initial; background-repeat: initial initial;">backgroundColor</code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li></ul><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li></li></ul>
边框圆角
<code class="hljs has-numbering" style="display: block; padding: 0px; background-color: transparent; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; word-wrap: normal; background-position: initial initial; background-repeat: initial initial;">borderTopLeftRadius borderTopRightRadius borderBottomLeftRadius borderBottomRightRadius borderRadius</code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li></ul><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li></ul>
宽高
<code class="hljs scss has-numbering" style="display: block; padding: 0px; background-color: transparent; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; word-wrap: normal; background-position: initial initial; background-repeat: initial initial;"><span class="hljs-attribute" style="box-sizing: border-box;">width</span> <span class="hljs-attribute" style="box-sizing: border-box;">height</span></code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li></ul><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li></li></ul>
Flex布局相关
<code class="hljs scss has-numbering" style="display: block; padding: 0px; background-color: transparent; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; word-wrap: normal; background-position: initial initial; background-repeat: initial initial;"><span class="hljs-attribute" style="box-sizing: border-box;">flex</span> number flexDirection <span class="hljs-function" style="box-sizing: border-box;">enum(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'row'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'column'</span>)</span> flexWrap <span class="hljs-function" style="box-sizing: border-box;">enum(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'wrap'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'nowrap'</span>)</span> alignItems <span class="hljs-function" style="box-sizing: border-box;">enum(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'flex-start'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'flex-end'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'center'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'stretch'</span>)</span> alignSelf <span class="hljs-function" style="box-sizing: border-box;">enum(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'auto'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'flex-start'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'flex-end'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'center'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'stretch'</span>)</span> justifyContent <span class="hljs-function" style="box-sizing: border-box;">enum(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'flex-start'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'flex-end'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'center'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'space-between'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'space-around'</span>)</span> </code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li><li style="box-sizing: border-box; padding: 0px 5px;">6</li></ul><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li><li style="box-sizing: border-box; padding: 0px 5px;">6</li><li></li></ul>
字体相关属性
<code class="hljs scss has-numbering" style="display: block; padding: 0px; background-color: transparent; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; word-wrap: normal; background-position: initial initial; background-repeat: initial initial;"><span class="hljs-attribute" style="box-sizing: border-box;">color</span> 字体颜色 fontFamily 字体族 fontSize 字体大小 fontStyle 字体样式，正常，倾斜等，值为<span class="hljs-function" style="box-sizing: border-box;">enum(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'normal'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'italic'</span>)</span> fontWeight 字体粗细，值为<span class="hljs-function" style="box-sizing: border-box;">enum(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"normal"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'bold'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'100'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'200'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'300'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'400'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'500'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'600'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'700'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'800'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'900'</span>)</span> letterSpacing 字符间隔 lineHeight 行高 textAlign 字体对齐方式，值为<span class="hljs-function" style="box-sizing: border-box;">enum(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"auto"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'left'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'right'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'center'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'justify'</span>)</span> textDecorationLine 貌似没效果，字体修饰，上划线，下划线，删除线，无修饰，值为<span class="hljs-function" style="box-sizing: border-box;">enum(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"none"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'underline'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'line-through'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'underline line-through'</span>)</span> textDecorationStyle <span class="hljs-function" style="box-sizing: border-box;">enum(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"solid"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'double'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'dotted'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'dashed'</span>)</span> 貌似没效果，修饰的线的类型 textDecorationColor 貌似没效果，修饰的线的颜色 writingDirection <span class="hljs-function" style="box-sizing: border-box;">enum(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">"auto"</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'ltr'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'rtl'</span>)</span> 不知道什么属性，写作方向？从左到右？从右到左？</code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li><li style="box-sizing: border-box; padding: 0px 5px;">6</li><li style="box-sizing: border-box; padding: 0px 5px;">7</li><li style="box-sizing: border-box; padding: 0px 5px;">8</li><li style="box-sizing: border-box; padding: 0px 5px;">9</li><li style="box-sizing: border-box; padding: 0px 5px;">10</li><li style="box-sizing: border-box; padding: 0px 5px;">11</li><li style="box-sizing: border-box; padding: 0px 5px;">12</li></ul><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li><li style="box-sizing: border-box; padding: 0px 5px;">6</li><li style="box-sizing: border-box; padding: 0px 5px;">7</li><li style="box-sizing: border-box; padding: 0px 5px;">8</li><li style="box-sizing: border-box; padding: 0px 5px;">9</li><li style="box-sizing: border-box; padding: 0px 5px;">10</li><li style="box-sizing: border-box; padding: 0px 5px;">11</li><li style="box-sizing: border-box; padding: 0px 5px;">12</li></ul>
图片相关属性
<code class="hljs scss has-numbering" style="display: block; padding: 0px; background-color: transparent; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; word-wrap: normal; background-position: initial initial; background-repeat: initial initial;">resizeMode <span class="hljs-function" style="box-sizing: border-box;">enum(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'cover'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'contain'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'stretch'</span>)</span> <span class="hljs-attribute" style="box-sizing: border-box;">overflow</span> <span class="hljs-function" style="box-sizing: border-box;">enum(<span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'visible'</span>, <span class="hljs-string" style="color: rgb(0, 136, 0); box-sizing: border-box;">'hidden'</span>)</span> 超出部分是否显示，<span class="hljs-value" style="box-sizing: border-box;">hidden</span>为隐藏 tintColor 着色，rgb字符串类型 <span class="hljs-attribute" style="box-sizing: border-box;">opacity</span> 透明度</code>其中resizeMode 中的三个属性，contain是指无论如何图片都包含在指定区域内，假设设置的宽度高度比图片大，则图片居中显示，否则，图片等比缩小显示
图像变换
<code class="hljs avrasm has-numbering" style="display: block; padding: 0px; background-color: transparent; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; word-wrap: normal; background-position: initial initial; background-repeat: initial initial;"><span class="hljs-label" style="box-sizing: border-box;">scaleX:</span>水平方向缩放 <span class="hljs-label" style="box-sizing: border-box;">scaleY:</span>垂直方向缩放 <span class="hljs-label" style="box-sizing: border-box;">rotation:</span>旋转 <span class="hljs-label" style="box-sizing: border-box;">translateX:</span>水平方向平移 <span class="hljs-label" style="box-sizing: border-box;">translateY:</span>水平方向平移</code><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li></ul><ul class="pre-numbering" style="box-sizing: border-box; position: absolute; width: 50px; background-color: rgb(238, 238, 238); top: 0px; left: 0px; margin: 0px; padding: 6px 0px 40px; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(221, 221, 221); list-style: none; text-align: right;"><li style="box-sizing: border-box; padding: 0px 5px;">1</li><li style="box-sizing: border-box; padding: 0px 5px;">2</li><li style="box-sizing: border-box; padding: 0px 5px;">3</li><li style="box-sizing: border-box; padding: 0px 5px;">4</li><li style="box-sizing: border-box; padding: 0px 5px;">5</li></ul>
阴影
<code class="hljs has-numbering" style="display: block; padding: 0px; background-color: transparent; color: inherit; box-sizing: border-box; font-family: 'Source Code Pro', monospace;font-size:undefined; white-space: pre; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; word-wrap: normal; background-position: initial initial; background-repeat: initial initial;">shadowColor shadowOffset shadowOpacity shadowRadius</code>
294
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
