<![CDATA[
<p>jsp</p><p> </p><div class="figure-img" data-ke-type="image" data-ke-style="alignLeft" data-ke-mobilestyle="widthOrigin"><img src="https://t1.daumcdn.net/cafeattach/1YqmY/3d7a20aa0928be6b1b3c1eda0ccb3f094bca444d" class="txc-image" data-img-src="https://t1.daumcdn.net/cafeattach/1YqmY/3d7a20aa0928be6b1b3c1eda0ccb3f094bca444d" data-origin-width="1432" data-origin-height="833"></div><p> </p><div class="figure-html" data-ke-type="html" data-source="<div class="colorscripter-code" style="color:#f0f0f0;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important; position:relative !important;overflow:auto"><table class="colorscripter-code-table" style="margin:0;padding:0;border:none;background-color:#272727;border-radius:4px;" cellspacing="0" cellpadding="0"><tr><td style="padding:6px;border-right:2px solid #4f4f4f"><div style="margin:0;padding:0;word-break:normal;text-align:right;color:#aaa;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important;line-height:130%"><div style="line-height:130%">1</div><div style="line-height:130%">2</div><div style="line-height:130%">3</div><div style="line-height:130%">4</div><div style="line-height:130%">5</div><div style="line-height:130%">6</div><div style="line-height:130%">7</div><div style="line-height:130%">8</div><div style="line-height:130%">9</div><div style="line-height:130%">10</div><div style="line-height:130%">11</div><div style="line-height:130%">12</div><div style="line-height:130%">13</div><div style="line-height:130%">14</div><div style="line-height:130%">15</div><div style="line-height:130%">16</div><div style="line-height:130%">17</div><div style="line-height:130%">18</div><div style="line-height:130%">19</div><div style="line-height:130%">20</div><div style="line-height:130%">21</div><div style="line-height:130%">22</div><div style="line-height:130%">23</div><div style="line-height:130%">24</div><div style="line-height:130%">25</div><div style="line-height:130%">26</div><div style="line-height:130%">27</div><div style="line-height:130%">28</div><div style="line-height:130%">29</div><div style="line-height:130%">30</div><div style="line-height:130%">31</div><div style="line-height:130%">32</div><div style="line-height:130%">33</div><div style="line-height:130%">34</div><div style="line-height:130%">35</div><div style="line-height:130%">36</div><div style="line-height:130%">37</div><div style="line-height:130%">38</div><div style="line-height:130%">39</div><div style="line-height:130%">40</div><div style="line-height:130%">41</div><div style="line-height:130%">42</div><div style="line-height:130%">43</div><div style="line-height:130%">44</div><div style="line-height:130%">45</div><div style="line-height:130%">46</div><div style="line-height:130%">47</div><div style="line-height:130%">48</div><div style="line-height:130%">49</div><div style="line-height:130%">50</div><div style="line-height:130%">51</div><div style="line-height:130%">52</div><div style="line-height:130%">53</div><div style="line-height:130%">54</div><div style="line-height:130%">55</div><div style="line-height:130%">56</div><div style="line-height:130%">57</div><div style="line-height:130%">58</div><div style="line-height:130%">59</div><div style="line-height:130%">60</div><div style="line-height:130%">61</div><div style="line-height:130%">62</div><div style="line-height:130%">63</div><div style="line-height:130%">64</div><div style="line-height:130%">65</div><div style="line-height:130%">66</div><div style="line-height:130%">67</div><div style="line-height:130%">68</div><div style="line-height:130%">69</div><div style="line-height:130%">70</div><div style="line-height:130%">71</div><div style="line-height:130%">72</div></div></td><td style="padding:6px 0;text-align:left"><div style="margin:0;padding:0;color:#f0f0f0;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important;line-height:130%"><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#999999">&lt;!--&nbsp;--&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">%@</span>&nbsp;<span style="color:#a8ff58">page</span>&nbsp;<span style="color:#a8ff58">language</span>=<span style="color:#ffd500">"java"</span><span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58">contentType</span>=<span style="color:#ffd500">"text/html;&nbsp;charset=UTF-8"</span><span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58">pageEncoding</span>=<span style="color:#ffd500">"UTF-8"</span><span style="color:#a8ff58">%</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">!DOCTYPE</span>&nbsp;<span style="color:#a8ff58">html</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">html</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">head</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">meta</span>&nbsp;<span style="color:#a8ff58">charset</span>=<span style="color:#ffd500">"UTF-8"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">meta</span>&nbsp;<span style="color:#a8ff58">name</span>=<span style="color:#ffd500">"viewport"</span><span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58">content</span>=<span style="color:#ffd500">"width=device-width&nbsp;,&nbsp;initial-scale=1"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">title</span><span style="color:#f0f0f0">&gt;</span>sample<span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">title</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">link</span>&nbsp;<span style="color:#a8ff58">rel</span>=<span style="color:#ffd500">"stylesheet"</span><span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58">href</span>=<span style="color:#ffd500">"https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">script</span>&nbsp;<span style="color:#a8ff58">src</span>=<span style="color:#ffd500">"https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"</span><span style="color:#ff3399"></span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">script</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">script</span>&nbsp;<span style="color:#a8ff58">src</span>=<span style="color:#ffd500">"https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"</span><span style="color:#ff3399"></span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">script</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">script</span>&nbsp;<span style="color:#a8ff58">src</span>=<span style="color:#ffd500">"https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js"</span><span style="color:#ff3399"></span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">script</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">link</span>&nbsp;<span style="color:#a8ff58">rel</span>=<span style="color:#ffd500">"stylesheet"</span><span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58">href</span>=<span style="color:#ffd500">"https://www.w3schools.com/w3css/4/w3.css"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">style</span>&nbsp;<span style="color:#a8ff58">type</span>=<span style="color:#ffd500">"text/css"</span><span style="color:#ff3399"></span><span style="color:#f0f0f0">&gt;</span><span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;li</span><span style="color:#a8ff58">:nth-child(odd):after</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="color:#999999">/*&nbsp;&nbsp;홀수번째&nbsp;모두&nbsp;&nbsp;*/</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;content</span><span style="color:#ff3399">:</span><span style="color:#E083FF">'&nbsp;&nbsp;odd'</span><span style="color:#ff3399">;</span><span style="color:#E083FF"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>}<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;li</span><span style="color:#a8ff58">:nth-child(even):after</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="color:#999999">/*&nbsp;&nbsp;짝수번째&nbsp;모두&nbsp;&nbsp;*/</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;content</span><span style="color:#ff3399">:</span><span style="color:#E083FF">'&nbsp;&nbsp;even'</span><span style="color:#ff3399">;</span><span style="color:#E083FF"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>}<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;li</span><span style="color:#a8ff58">:nth-child(5n):before</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="color:#999999">/*&nbsp;&nbsp;5의&nbsp;배수&nbsp;번째&nbsp;모두&nbsp;&nbsp;*/</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;content</span><span style="color:#ff3399">:</span><span style="color:#E083FF">'5의배수-&nbsp;&nbsp;&nbsp;'</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>}<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;li</span><span style="color:#a8ff58">:nth-child(-n+3)</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="color:#999999">/*&nbsp;&nbsp;앞에서&nbsp;1번부터&nbsp;3번까지&nbsp;&nbsp;*/</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;background-color</span><span style="color:#ff3399">:</span><span style="color:#E083FF">&nbsp;red</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>}<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;li</span><span style="color:#a8ff58">:nth-child(n+25)</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="color:#999999">/*&nbsp;&nbsp;20번부터&nbsp;끝까지&nbsp;&nbsp;*/</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;background-color</span><span style="color:#ff3399">:</span><span style="color:#E083FF">&nbsp;green</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>}<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;li</span><span style="color:#a8ff58">:nth-child(n+5):nth-child(-n+8)</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="color:#999999">/*&nbsp;&nbsp;앞에서&nbsp;2번부터&nbsp;4번&nbsp;전까지&nbsp;&nbsp;*/</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;background-color</span><span style="color:#ff3399">:</span><span style="color:#E083FF">&nbsp;gold</span><span style="color:#ff3399">;</span><span style="color:#E083FF">&nbsp;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>}</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">style</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">head</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">body</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">br/</span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">div</span>&nbsp;<span style="color:#a8ff58">class</span>=<span style="color:#ffd500">"container"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">div</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">%--</span>&nbsp;<span style="color:#a8ff58">HelloWord</span>&nbsp;<span style="color:#a8ff58">--%</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;HelloWord</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">ul</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">%</span>&nbsp;<span style="color:#a8ff58"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58">for(int</span>&nbsp;<span style="color:#a8ff58">i</span>&nbsp;<span style="color:#a8ff58"></span>=<span style="color:#a8ff58">0;</span>&nbsp;i<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">30;</span>&nbsp;<span style="color:#a8ff58">i++){</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;out.println(<span style="color:#ffd500">"&lt;li&gt;&nbsp;"</span>+i+<span style="color:#ffd500">"&lt;/li&gt;"</span><span style="color:#a8ff58">);</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58">}</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58">%</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">ul</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">div</span><span style="color:#f0f0f0">&gt;</span>&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">div</span><span style="color:#f0f0f0">&gt;</span>&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">br/</span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">body</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">html</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div></div><div style="text-align:right;margin-top:-13px;margin-right:5px;font-size:9px;font-style:italic"><a href="http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4ftext-decoration:none">Colored by Color Scripter</a></div></td><td style="vertical-align:bottom;padding:0 2px 4px 0"><a href="http://colorscripter.com/info#e" target="_blank" style="text-decoration:none;color:white"><span style="font-size:9px;word-break:normal;background-color:#4f4f4f;color:white;border-radius:10px;padding:1px">cs</span></a></td></tr></table></div>"><div data-ke-class="article"><div class="colorscripter-code" style="color:#f0f0f0;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important; position:relative !important;overflow:auto"><table class="colorscripter-code-table" style="margin:0;padding:0;border:none;background-color:#272727;border-radius:4px;" cellspacing="0" cellpadding="0"><tr><td style="padding:6px;border-right:2px solid #4f4f4f"><div style="margin:0;padding:0;word-break:normal;text-align:right;color:#aaa;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important;line-height:130%"><div style="line-height:130%">1</div><div style="line-height:130%">2</div><div style="line-height:130%">3</div><div style="line-height:130%">4</div><div style="line-height:130%">5</div><div style="line-height:130%">6</div><div style="line-height:130%">7</div><div style="line-height:130%">8</div><div style="line-height:130%">9</div><div style="line-height:130%">10</div><div style="line-height:130%">11</div><div style="line-height:130%">12</div><div style="line-height:130%">13</div><div style="line-height:130%">14</div><div style="line-height:130%">15</div><div style="line-height:130%">16</div><div style="line-height:130%">17</div><div style="line-height:130%">18</div><div style="line-height:130%">19</div><div style="line-height:130%">20</div><div style="line-height:130%">21</div><div style="line-height:130%">22</div><div style="line-height:130%">23</div><div style="line-height:130%">24</div><div style="line-height:130%">25</div><div style="line-height:130%">26</div><div style="line-height:130%">27</div><div style="line-height:130%">28</div><div style="line-height:130%">29</div><div style="line-height:130%">30</div><div style="line-height:130%">31</div><div style="line-height:130%">32</div><div style="line-height:130%">33</div><div style="line-height:130%">34</div><div style="line-height:130%">35</div><div style="line-height:130%">36</div><div style="line-height:130%">37</div><div style="line-height:130%">38</div><div style="line-height:130%">39</div><div style="line-height:130%">40</div><div style="line-height:130%">41</div><div style="line-height:130%">42</div><div style="line-height:130%">43</div><div style="line-height:130%">44</div><div style="line-height:130%">45</div><div style="line-height:130%">46</div><div style="line-height:130%">47</div><div style="line-height:130%">48</div><div style="line-height:130%">49</div><div style="line-height:130%">50</div><div style="line-height:130%">51</div><div style="line-height:130%">52</div><div style="line-height:130%">53</div><div style="line-height:130%">54</div><div style="line-height:130%">55</div><div style="line-height:130%">56</div><div style="line-height:130%">57</div><div style="line-height:130%">58</div><div style="line-height:130%">59</div><div style="line-height:130%">60</div><div style="line-height:130%">61</div><div style="line-height:130%">62</div><div style="line-height:130%">63</div><div style="line-height:130%">64</div><div style="line-height:130%">65</div><div style="line-height:130%">66</div><div style="line-height:130%">67</div><div style="line-height:130%">68</div><div style="line-height:130%">69</div><div style="line-height:130%">70</div><div style="line-height:130%">71</div><div style="line-height:130%">72</div></div></td><td style="padding:6px 0;text-align:left"><div style="margin:0;padding:0;color:#f0f0f0;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important;line-height:130%"><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#999999"><!-- --></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0"><</span><span style="color:#ff3399">%@</span> <span style="color:#a8ff58">page</span> <span style="color:#a8ff58">language</span>=<span style="color:#ffd500">"java"</span><span style="color:#a8ff58"></span> <span style="color:#a8ff58">contentType</span>=<span style="color:#ffd500">"text/html; charset=UTF-8"</span><span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58">pageEncoding</span>=<span style="color:#ffd500">"UTF-8"</span><span style="color:#a8ff58">%</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0"><</span><span style="color:#ff3399">!DOCTYPE</span> <span style="color:#a8ff58">html</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0"><</span><span style="color:#ff3399">html</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">head</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">meta</span> <span style="color:#a8ff58">charset</span>=<span style="color:#ffd500">"UTF-8"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">meta</span> <span style="color:#a8ff58">name</span>=<span style="color:#ffd500">"viewport"</span><span style="color:#a8ff58"></span> <span style="color:#a8ff58">content</span>=<span style="color:#ffd500">"width=device-width , initial-scale=1"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">title</span><span style="color:#f0f0f0">></span>sample<span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">title</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">link</span> <span style="color:#a8ff58">rel</span>=<span style="color:#ffd500">"stylesheet"</span><span style="color:#a8ff58"></span> <span style="color:#a8ff58">href</span>=<span style="color:#ffd500">"https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">script</span> <span style="color:#a8ff58">src</span>=<span style="color:#ffd500">"https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"</span><span style="color:#ff3399"></span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">script</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">script</span> <span style="color:#a8ff58">src</span>=<span style="color:#ffd500">"https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"</span><span style="color:#ff3399"></span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">script</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">script</span> <span style="color:#a8ff58">src</span>=<span style="color:#ffd500">"https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js"</span><span style="color:#ff3399"></span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">script</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">link</span> <span style="color:#a8ff58">rel</span>=<span style="color:#ffd500">"stylesheet"</span><span style="color:#a8ff58"></span> <span style="color:#a8ff58">href</span>=<span style="color:#ffd500">"https://www.w3schools.com/w3css/4/w3.css"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">style</span> <span style="color:#a8ff58">type</span>=<span style="color:#ffd500">"text/css"</span><span style="color:#ff3399"></span><span style="color:#f0f0f0">></span><span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> </span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> li</span><span style="color:#a8ff58">:nth-child(odd):after</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> </span><span style="color:#999999">/* 홀수번째 모두 */</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa"> content</span><span style="color:#ff3399">:</span><span style="color:#E083FF">' odd'</span><span style="color:#ff3399">;</span><span style="color:#E083FF"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF"> </span>}<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> li</span><span style="color:#a8ff58">:nth-child(even):after</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> </span><span style="color:#999999">/* 짝수번째 모두 */</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa"> content</span><span style="color:#ff3399">:</span><span style="color:#E083FF">' even'</span><span style="color:#ff3399">;</span><span style="color:#E083FF"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF"> </span>}<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> li</span><span style="color:#a8ff58">:nth-child(5n):before</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> </span><span style="color:#999999">/* 5의 배수 번째 모두 */</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa"> content</span><span style="color:#ff3399">:</span><span style="color:#E083FF">'5의배수- '</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF"> </span>}<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> </span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> li</span><span style="color:#a8ff58">:nth-child(-n+3)</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> </span><span style="color:#999999">/* 앞에서 1번부터 3번까지 */</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa"> background-color</span><span style="color:#ff3399">:</span><span style="color:#E083FF"> red</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF"> </span>}<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> li</span><span style="color:#a8ff58">:nth-child(n+25)</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> </span><span style="color:#999999">/* 20번부터 끝까지 */</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa"> background-color</span><span style="color:#ff3399">:</span><span style="color:#E083FF"> green</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF"> </span>}<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> li</span><span style="color:#a8ff58">:nth-child(n+5):nth-child(-n+8)</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> </span><span style="color:#999999">/* 앞에서 2번부터 4번 전까지 */</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa"> background-color</span><span style="color:#ff3399">:</span><span style="color:#E083FF"> gold</span><span style="color:#ff3399">;</span><span style="color:#E083FF"> </span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF"> </span>}</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">style</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">head</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">body</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#ff3399">br/</span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">div</span> <span style="color:#a8ff58">class</span>=<span style="color:#ffd500">"container"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">div</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">%--</span> <span style="color:#a8ff58">HelloWord</span> <span style="color:#a8ff58">--%</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> HelloWord</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">ul</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">%</span> <span style="color:#a8ff58"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58">for(int</span> <span style="color:#a8ff58">i</span> <span style="color:#a8ff58"></span>=<span style="color:#a8ff58">0;</span> i<span style="color:#f0f0f0"><</span><span style="color:#ff3399">30;</span> <span style="color:#a8ff58">i++){</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> out.println(<span style="color:#ffd500">"<li> "</span>+i+<span style="color:#ffd500">"</li>"</span><span style="color:#a8ff58">);</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58">}</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58">%</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">ul</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">div</span><span style="color:#f0f0f0">></span> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">div</span><span style="color:#f0f0f0">></span> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#ff3399">br/</span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">body</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">html</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div></div><div style="text-align:right;margin-top:-13px;margin-right:5px;font-size:9px;font-style:italic"><a href="http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4ftext-decoration:none">Colored by Color Scripter</a></div></td><td style="vertical-align:bottom;padding:0 2px 4px 0"><a href="http://colorscripter.com/info#e" target="_blank" style="text-decoration:none;color:white"><span style="font-size:9px;word-break:normal;background-color:#4f4f4f;color:white;border-radius:10px;padding:1px">cs</span></a></td></tr></table></div></div></div><p> </p><p> </p><p>jsp 수정 및 테스트 </p><p>홀수와 짝수의 위치가 안맞아서 확인을 해보니</p><p>java에서 for문을 0부터 진행했는데 </p><p>html에서는 인덱스가 1부터 시작해서 표현상 홀수짝수가 안맞는 현상 발생 </p><p>그래서 1부터 30이하로 수정</p><p> </p><div class="figure-img" data-ke-type="image" data-ke-style="alignLeft" data-ke-mobilestyle="widthOrigin"><img src="https://t1.daumcdn.net/cafeattach/1YqmY/596995d5bf7d551fd5e917cab9461b2cd65db25d" class="txc-image" data-img-src="https://t1.daumcdn.net/cafeattach/1YqmY/596995d5bf7d551fd5e917cab9461b2cd65db25d" data-origin-width="1174" data-origin-height="922"></div><div class="figure-html" data-ke-type="html" data-source="<div class="colorscripter-code" style="color:#f0f0f0;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important; position:relative !important;overflow:auto"><table class="colorscripter-code-table" style="margin:0;padding:0;border:none;background-color:#272727;border-radius:4px;" cellspacing="0" cellpadding="0"><tr><td style="padding:6px;border-right:2px solid #4f4f4f"><div style="margin:0;padding:0;word-break:normal;text-align:right;color:#aaa;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important;line-height:130%"><div style="line-height:130%">1</div><div style="line-height:130%">2</div><div style="line-height:130%">3</div><div style="line-height:130%">4</div><div style="line-height:130%">5</div><div style="line-height:130%">6</div><div style="line-height:130%">7</div><div style="line-height:130%">8</div><div style="line-height:130%">9</div><div style="line-height:130%">10</div><div style="line-height:130%">11</div><div style="line-height:130%">12</div><div style="line-height:130%">13</div><div style="line-height:130%">14</div><div style="line-height:130%">15</div><div style="line-height:130%">16</div><div style="line-height:130%">17</div><div style="line-height:130%">18</div><div style="line-height:130%">19</div><div style="line-height:130%">20</div><div style="line-height:130%">21</div><div style="line-height:130%">22</div><div style="line-height:130%">23</div><div style="line-height:130%">24</div><div style="line-height:130%">25</div><div style="line-height:130%">26</div><div style="line-height:130%">27</div><div style="line-height:130%">28</div><div style="line-height:130%">29</div><div style="line-height:130%">30</div><div style="line-height:130%">31</div><div style="line-height:130%">32</div><div style="line-height:130%">33</div><div style="line-height:130%">34</div><div style="line-height:130%">35</div><div style="line-height:130%">36</div><div style="line-height:130%">37</div><div style="line-height:130%">38</div><div style="line-height:130%">39</div><div style="line-height:130%">40</div><div style="line-height:130%">41</div><div style="line-height:130%">42</div><div style="line-height:130%">43</div><div style="line-height:130%">44</div><div style="line-height:130%">45</div><div style="line-height:130%">46</div><div style="line-height:130%">47</div><div style="line-height:130%">48</div><div style="line-height:130%">49</div><div style="line-height:130%">50</div><div style="line-height:130%">51</div><div style="line-height:130%">52</div><div style="line-height:130%">53</div><div style="line-height:130%">54</div><div style="line-height:130%">55</div><div style="line-height:130%">56</div><div style="line-height:130%">57</div><div style="line-height:130%">58</div><div style="line-height:130%">59</div><div style="line-height:130%">60</div><div style="line-height:130%">61</div><div style="line-height:130%">62</div><div style="line-height:130%">63</div><div style="line-height:130%">64</div><div style="line-height:130%">65</div><div style="line-height:130%">66</div><div style="line-height:130%">67</div><div style="line-height:130%">68</div><div style="line-height:130%">69</div><div style="line-height:130%">70</div><div style="line-height:130%">71</div><div style="line-height:130%">72</div><div style="line-height:130%">73</div><div style="line-height:130%">74</div><div style="line-height:130%">75</div><div style="line-height:130%">76</div><div style="line-height:130%">77</div><div style="line-height:130%">78</div><div style="line-height:130%">79</div><div style="line-height:130%">80</div><div style="line-height:130%">81</div><div style="line-height:130%">82</div></div></td><td style="padding:6px 0;text-align:left"><div style="margin:0;padding:0;color:#f0f0f0;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important;line-height:130%"><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#999999">&lt;!--&nbsp;--&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">%@</span>&nbsp;<span style="color:#a8ff58">page</span>&nbsp;<span style="color:#a8ff58">language</span>=<span style="color:#ffd500">"java"</span><span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58">contentType</span>=<span style="color:#ffd500">"text/html;&nbsp;charset=UTF-8"</span><span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58">pageEncoding</span>=<span style="color:#ffd500">"UTF-8"</span><span style="color:#a8ff58">%</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">!DOCTYPE</span>&nbsp;<span style="color:#a8ff58">html</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">html</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">head</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">meta</span>&nbsp;<span style="color:#a8ff58">charset</span>=<span style="color:#ffd500">"UTF-8"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">meta</span>&nbsp;<span style="color:#a8ff58">name</span>=<span style="color:#ffd500">"viewport"</span><span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58">content</span>=<span style="color:#ffd500">"width=device-width&nbsp;,&nbsp;initial-scale=1"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">title</span><span style="color:#f0f0f0">&gt;</span>sample<span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">title</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">link</span>&nbsp;<span style="color:#a8ff58">rel</span>=<span style="color:#ffd500">"stylesheet"</span><span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58">href</span>=<span style="color:#ffd500">"https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">script</span>&nbsp;<span style="color:#a8ff58">src</span>=<span style="color:#ffd500">"https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"</span><span style="color:#ff3399"></span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">script</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">script</span>&nbsp;<span style="color:#a8ff58">src</span>=<span style="color:#ffd500">"https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"</span><span style="color:#ff3399"></span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">script</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">script</span>&nbsp;<span style="color:#a8ff58">src</span>=<span style="color:#ffd500">"https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js"</span><span style="color:#ff3399"></span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">script</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">link</span>&nbsp;<span style="color:#a8ff58">rel</span>=<span style="color:#ffd500">"stylesheet"</span><span style="color:#a8ff58"></span>&nbsp;<span style="color:#a8ff58">href</span>=<span style="color:#ffd500">"https://www.w3schools.com/w3css/4/w3.css"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">style</span>&nbsp;<span style="color:#a8ff58">type</span>=<span style="color:#ffd500">"text/css"</span><span style="color:#ff3399"></span><span style="color:#f0f0f0">&gt;</span><span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;.Numcheck</span>{<span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;border</span><span style="color:#ff3399">:</span><span style="color:#E083FF">&nbsp;1px&nbsp;solid&nbsp;black</span><span style="color:#ff3399">;</span><span style="color:#4be6fa">&nbsp;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;font-size</span><span style="color:#ff3399">:</span><span style="color:#E083FF">&nbsp;20px</span><span style="color:#ff3399">;</span><span style="color:#E083FF"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>}<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;li</span><span style="color:#a8ff58">:nth-child(odd):before</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="color:#999999">/*&nbsp;&nbsp;홀수번째&nbsp;모두&nbsp;&nbsp;*/</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;content</span><span style="color:#ff3399">:</span><span style="color:#E083FF">'&nbsp;(&nbsp;odd&nbsp;홀수&nbsp;-&nbsp;이전&nbsp;)&nbsp;'</span><span style="color:#ff3399">;</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;background-color</span><span style="color:#ff3399">:</span><span style="color:#E083FF">&nbsp;#faa</span><span style="color:#ff3399">;</span><span style="color:#E083FF">&nbsp;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>}<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;li</span><span style="color:#a8ff58">:nth-child(even):after</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="color:#999999">/*&nbsp;&nbsp;짝수번째&nbsp;모두&nbsp;&nbsp;*/</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;content</span><span style="color:#ff3399">:</span><span style="color:#E083FF">'&nbsp;(&nbsp;even&nbsp;짝수&nbsp;-이후&nbsp;)&nbsp;'</span><span style="color:#ff3399">;</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;background-color</span><span style="color:#ff3399">:</span><span style="color:#E083FF">&nbsp;#afa</span><span style="color:#ff3399">;</span><span style="color:#E083FF">&nbsp;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>}<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;li</span><span style="color:#a8ff58">:nth-child(odd)</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="color:#999999">/*&nbsp;&nbsp;홀수번째&nbsp;모두&nbsp;&nbsp;*/</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;color</span><span style="color:#ff3399">:</span><span style="color:#E083FF">&nbsp;chocolate</span><span style="color:#ff3399">;</span><span style="color:#E083FF"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>}<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;li</span><span style="color:#a8ff58">:nth-child(5n):before</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="color:#999999">/*&nbsp;&nbsp;5의&nbsp;배수&nbsp;번째&nbsp;모두&nbsp;&nbsp;*/</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;content</span><span style="color:#ff3399">:</span><span style="color:#E083FF">'5의배수-&nbsp;&nbsp;&nbsp;'</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>}<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;li</span><span style="color:#a8ff58">:nth-child(-n+3)</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="color:#999999">/*&nbsp;&nbsp;앞에서&nbsp;1번부터&nbsp;3번까지&nbsp;&nbsp;*/</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;background-color</span><span style="color:#ff3399">:</span><span style="color:#E083FF">&nbsp;red</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>}<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;li</span><span style="color:#a8ff58">:nth-child(n+25)</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="color:#999999">/*&nbsp;&nbsp;20번부터&nbsp;끝까지&nbsp;&nbsp;*/</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;background-color</span><span style="color:#ff3399">:</span><span style="color:#E083FF">&nbsp;green</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>}<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;li</span><span style="color:#a8ff58">:nth-child(n+5):nth-child(-n+8)</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span style="color:#999999">/*&nbsp;&nbsp;앞에서&nbsp;2번부터&nbsp;4번&nbsp;전까지&nbsp;&nbsp;*/</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;background-color</span><span style="color:#ff3399">:</span><span style="color:#E083FF">&nbsp;gold</span><span style="color:#ff3399">;</span><span style="color:#E083FF">&nbsp;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>}</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">style</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">head</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">body</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">br/</span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">div</span>&nbsp;<span style="color:#a8ff58">class</span>=<span style="color:#ffd500">"container"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">div</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">%--</span>&nbsp;<span style="color:#a8ff58">HelloWord</span>&nbsp;<span style="color:#a8ff58">--%</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;HelloWord</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">ul</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">%</span>&nbsp;<span style="color:#a8ff58"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58">for(int</span>&nbsp;<span style="color:#a8ff58">i</span>&nbsp;<span style="color:#a8ff58"></span>=<span style="color:#a8ff58">1;</span>&nbsp;i<span style="color:#a8ff58">&lt;</span>=<span style="color:#a8ff58">30;</span>&nbsp;<span style="color:#a8ff58">i++){</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;out.println(<span style="color:#ffd500">"&lt;li&gt;&nbsp;&lt;span&nbsp;class='Numcheck'&gt;"</span>+i+<span style="color:#ffd500">"&lt;/span&gt;&nbsp;&lt;/li&gt;"</span><span style="color:#a8ff58">);</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58">}</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58"></span>&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#a8ff58">%</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">ul</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">div</span><span style="color:#f0f0f0">&gt;</span>&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">div</span><span style="color:#f0f0f0">&gt;</span>&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#ff3399">br/</span><span style="color:#f0f0f0">&gt;</span><span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">body</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0">&lt;</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">html</span><span style="color:#f0f0f0">&gt;</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div></div><div style="text-align:right;margin-top:-13px;margin-right:5px;font-size:9px;font-style:italic"><a href="http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4ftext-decoration:none">Colored by Color Scripter</a></div></td><td style="vertical-align:bottom;padding:0 2px 4px 0"><a href="http://colorscripter.com/info#e" target="_blank" style="text-decoration:none;color:white"><span style="font-size:9px;word-break:normal;background-color:#4f4f4f;color:white;border-radius:10px;padding:1px">cs</span></a></td></tr></table></div>"><div data-ke-class="article"><div class="colorscripter-code" style="color:#f0f0f0;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important; position:relative !important;overflow:auto"><table class="colorscripter-code-table" style="margin:0;padding:0;border:none;background-color:#272727;border-radius:4px;" cellspacing="0" cellpadding="0"><tr><td style="padding:6px;border-right:2px solid #4f4f4f"><div style="margin:0;padding:0;word-break:normal;text-align:right;color:#aaa;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important;line-height:130%"><div style="line-height:130%">1</div><div style="line-height:130%">2</div><div style="line-height:130%">3</div><div style="line-height:130%">4</div><div style="line-height:130%">5</div><div style="line-height:130%">6</div><div style="line-height:130%">7</div><div style="line-height:130%">8</div><div style="line-height:130%">9</div><div style="line-height:130%">10</div><div style="line-height:130%">11</div><div style="line-height:130%">12</div><div style="line-height:130%">13</div><div style="line-height:130%">14</div><div style="line-height:130%">15</div><div style="line-height:130%">16</div><div style="line-height:130%">17</div><div style="line-height:130%">18</div><div style="line-height:130%">19</div><div style="line-height:130%">20</div><div style="line-height:130%">21</div><div style="line-height:130%">22</div><div style="line-height:130%">23</div><div style="line-height:130%">24</div><div style="line-height:130%">25</div><div style="line-height:130%">26</div><div style="line-height:130%">27</div><div style="line-height:130%">28</div><div style="line-height:130%">29</div><div style="line-height:130%">30</div><div style="line-height:130%">31</div><div style="line-height:130%">32</div><div style="line-height:130%">33</div><div style="line-height:130%">34</div><div style="line-height:130%">35</div><div style="line-height:130%">36</div><div style="line-height:130%">37</div><div style="line-height:130%">38</div><div style="line-height:130%">39</div><div style="line-height:130%">40</div><div style="line-height:130%">41</div><div style="line-height:130%">42</div><div style="line-height:130%">43</div><div style="line-height:130%">44</div><div style="line-height:130%">45</div><div style="line-height:130%">46</div><div style="line-height:130%">47</div><div style="line-height:130%">48</div><div style="line-height:130%">49</div><div style="line-height:130%">50</div><div style="line-height:130%">51</div><div style="line-height:130%">52</div><div style="line-height:130%">53</div><div style="line-height:130%">54</div><div style="line-height:130%">55</div><div style="line-height:130%">56</div><div style="line-height:130%">57</div><div style="line-height:130%">58</div><div style="line-height:130%">59</div><div style="line-height:130%">60</div><div style="line-height:130%">61</div><div style="line-height:130%">62</div><div style="line-height:130%">63</div><div style="line-height:130%">64</div><div style="line-height:130%">65</div><div style="line-height:130%">66</div><div style="line-height:130%">67</div><div style="line-height:130%">68</div><div style="line-height:130%">69</div><div style="line-height:130%">70</div><div style="line-height:130%">71</div><div style="line-height:130%">72</div><div style="line-height:130%">73</div><div style="line-height:130%">74</div><div style="line-height:130%">75</div><div style="line-height:130%">76</div><div style="line-height:130%">77</div><div style="line-height:130%">78</div><div style="line-height:130%">79</div><div style="line-height:130%">80</div><div style="line-height:130%">81</div><div style="line-height:130%">82</div></div></td><td style="padding:6px 0;text-align:left"><div style="margin:0;padding:0;color:#f0f0f0;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important;line-height:130%"><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#999999"><!-- --></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0"><</span><span style="color:#ff3399">%@</span> <span style="color:#a8ff58">page</span> <span style="color:#a8ff58">language</span>=<span style="color:#ffd500">"java"</span><span style="color:#a8ff58"></span> <span style="color:#a8ff58">contentType</span>=<span style="color:#ffd500">"text/html; charset=UTF-8"</span><span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58">pageEncoding</span>=<span style="color:#ffd500">"UTF-8"</span><span style="color:#a8ff58">%</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0"><</span><span style="color:#ff3399">!DOCTYPE</span> <span style="color:#a8ff58">html</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0"><</span><span style="color:#ff3399">html</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">head</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">meta</span> <span style="color:#a8ff58">charset</span>=<span style="color:#ffd500">"UTF-8"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">meta</span> <span style="color:#a8ff58">name</span>=<span style="color:#ffd500">"viewport"</span><span style="color:#a8ff58"></span> <span style="color:#a8ff58">content</span>=<span style="color:#ffd500">"width=device-width , initial-scale=1"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">title</span><span style="color:#f0f0f0">></span>sample<span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">title</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">link</span> <span style="color:#a8ff58">rel</span>=<span style="color:#ffd500">"stylesheet"</span><span style="color:#a8ff58"></span> <span style="color:#a8ff58">href</span>=<span style="color:#ffd500">"https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">script</span> <span style="color:#a8ff58">src</span>=<span style="color:#ffd500">"https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"</span><span style="color:#ff3399"></span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">script</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">script</span> <span style="color:#a8ff58">src</span>=<span style="color:#ffd500">"https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"</span><span style="color:#ff3399"></span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">script</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">script</span> <span style="color:#a8ff58">src</span>=<span style="color:#ffd500">"https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js"</span><span style="color:#ff3399"></span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">script</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">link</span> <span style="color:#a8ff58">rel</span>=<span style="color:#ffd500">"stylesheet"</span><span style="color:#a8ff58"></span> <span style="color:#a8ff58">href</span>=<span style="color:#ffd500">"https://www.w3schools.com/w3css/4/w3.css"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">style</span> <span style="color:#a8ff58">type</span>=<span style="color:#ffd500">"text/css"</span><span style="color:#ff3399"></span><span style="color:#f0f0f0">></span><span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> .Numcheck</span>{<span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa"> border</span><span style="color:#ff3399">:</span><span style="color:#E083FF"> 1px solid black</span><span style="color:#ff3399">;</span><span style="color:#4be6fa"> </span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa"> font-size</span><span style="color:#ff3399">:</span><span style="color:#E083FF"> 20px</span><span style="color:#ff3399">;</span><span style="color:#E083FF"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF"> </span>}<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> li</span><span style="color:#a8ff58">:nth-child(odd):before</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> </span><span style="color:#999999">/* 홀수번째 모두 */</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa"> content</span><span style="color:#ff3399">:</span><span style="color:#E083FF">' ( odd 홀수 - 이전 ) '</span><span style="color:#ff3399">;</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa"> background-color</span><span style="color:#ff3399">:</span><span style="color:#E083FF"> #faa</span><span style="color:#ff3399">;</span><span style="color:#E083FF"> </span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF"> </span>}<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> li</span><span style="color:#a8ff58">:nth-child(even):after</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> </span><span style="color:#999999">/* 짝수번째 모두 */</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa"> content</span><span style="color:#ff3399">:</span><span style="color:#E083FF">' ( even 짝수 -이후 ) '</span><span style="color:#ff3399">;</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa"> background-color</span><span style="color:#ff3399">:</span><span style="color:#E083FF"> #afa</span><span style="color:#ff3399">;</span><span style="color:#E083FF"> </span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF"> </span>}<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> li</span><span style="color:#a8ff58">:nth-child(odd)</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> </span><span style="color:#999999">/* 홀수번째 모두 */</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa"> color</span><span style="color:#ff3399">:</span><span style="color:#E083FF"> chocolate</span><span style="color:#ff3399">;</span><span style="color:#E083FF"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF"> </span>}<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> </span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> li</span><span style="color:#a8ff58">:nth-child(5n):before</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> </span><span style="color:#999999">/* 5의 배수 번째 모두 */</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa"> content</span><span style="color:#ff3399">:</span><span style="color:#E083FF">'5의배수- '</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF"> </span>}<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> </span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> li</span><span style="color:#a8ff58">:nth-child(-n+3)</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> </span><span style="color:#999999">/* 앞에서 1번부터 3번까지 */</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa"> background-color</span><span style="color:#ff3399">:</span><span style="color:#E083FF"> red</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF"> </span>}<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> li</span><span style="color:#a8ff58">:nth-child(n+25)</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> </span><span style="color:#999999">/* 20번부터 끝까지 */</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa"> background-color</span><span style="color:#ff3399">:</span><span style="color:#E083FF"> green</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF"> </span>}<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> li</span><span style="color:#a8ff58">:nth-child(n+5):nth-child(-n+8)</span><span style="color:#ff3399"></span>{<span style="color:#ff3399"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399"> </span><span style="color:#999999">/* 앞에서 2번부터 4번 전까지 */</span><span style="color:#4be6fa"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#4be6fa"> background-color</span><span style="color:#ff3399">:</span><span style="color:#E083FF"> gold</span><span style="color:#ff3399">;</span><span style="color:#E083FF"> </span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#E083FF"> </span>}</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">style</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">head</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">body</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#ff3399">br/</span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">div</span> <span style="color:#a8ff58">class</span>=<span style="color:#ffd500">"container"</span><span style="color:#a8ff58"></span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">div</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">%--</span> <span style="color:#a8ff58">HelloWord</span> <span style="color:#a8ff58">--%</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> HelloWord</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">ul</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">%</span> <span style="color:#a8ff58"></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58">for(int</span> <span style="color:#a8ff58">i</span> <span style="color:#a8ff58"></span>=<span style="color:#a8ff58">1;</span> i<span style="color:#a8ff58"><</span>=<span style="color:#a8ff58">30;</span> <span style="color:#a8ff58">i++){</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> out.println(<span style="color:#ffd500">"<li> <span class='Numcheck'>"</span>+i+<span style="color:#ffd500">"</span> </li>"</span><span style="color:#a8ff58">);</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58">}</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58"></span> <span style="color:#a8ff58">%</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">ul</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">div</span><span style="color:#f0f0f0">></span> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">div</span><span style="color:#f0f0f0">></span> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#ff3399">br/</span><span style="color:#f0f0f0">></span><span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">p</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">body</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#f0f0f0"><</span><span style="color:#f0f0f0">/</span><span style="color:#ff3399">html</span><span style="color:#f0f0f0">></span></div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div></div><div style="text-align:right;margin-top:-13px;margin-right:5px;font-size:9px;font-style:italic"><a href="http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4ftext-decoration:none">Colored by Color Scripter</a></div></td><td style="vertical-align:bottom;padding:0 2px 4px 0"><a href="http://colorscripter.com/info#e" target="_blank" style="text-decoration:none;color:white"><span style="font-size:9px;word-break:normal;background-color:#4f4f4f;color:white;border-radius:10px;padding:1px">cs</span></a></td></tr></table></div></div></div><p> </p><p>java</p><div class="figure-img" data-ke-type="image" data-ke-style="alignLeft" data-ke-mobilestyle="widthOrigin"><img src="https://t1.daumcdn.net/cafeattach/1YqmY/c42e4307efb1993de7054c6dfee241813a5aad68" class="txc-image" data-img-src="https://t1.daumcdn.net/cafeattach/1YqmY/c42e4307efb1993de7054c6dfee241813a5aad68" data-origin-width="1610" data-origin-height="674"></div><p> </p><div class="figure-html" data-ke-type="html" data-source="<div class="colorscripter-code" style="color:#f0f0f0;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important; position:relative !important;overflow:auto"><table class="colorscripter-code-table" style="margin:0;padding:0;border:none;background-color:#272727;border-radius:4px;" cellspacing="0" cellpadding="0"><tr><td style="padding:6px;border-right:2px solid #4f4f4f"><div style="margin:0;padding:0;word-break:normal;text-align:right;color:#aaa;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important;line-height:130%"><div style="line-height:130%">1</div><div style="line-height:130%">2</div><div style="line-height:130%">3</div><div style="line-height:130%">4</div><div style="line-height:130%">5</div><div style="line-height:130%">6</div><div style="line-height:130%">7</div><div style="line-height:130%">8</div><div style="line-height:130%">9</div><div style="line-height:130%">10</div><div style="line-height:130%">11</div><div style="line-height:130%">12</div><div style="line-height:130%">13</div><div style="line-height:130%">14</div><div style="line-height:130%">15</div><div style="line-height:130%">16</div><div style="line-height:130%">17</div><div style="line-height:130%">18</div><div style="line-height:130%">19</div><div style="line-height:130%">20</div><div style="line-height:130%">21</div><div style="line-height:130%">22</div><div style="line-height:130%">23</div><div style="line-height:130%">24</div><div style="line-height:130%">25</div><div style="line-height:130%">26</div><div style="line-height:130%">27</div><div style="line-height:130%">28</div><div style="line-height:130%">29</div><div style="line-height:130%">30</div><div style="line-height:130%">31</div><div style="line-height:130%">32</div><div style="line-height:130%">33</div><div style="line-height:130%">34</div><div style="line-height:130%">35</div><div style="line-height:130%">36</div><div style="line-height:130%">37</div><div style="line-height:130%">38</div><div style="line-height:130%">39</div><div style="line-height:130%">40</div><div style="line-height:130%">41</div><div style="line-height:130%">42</div><div style="line-height:130%">43</div><div style="line-height:130%">44</div><div style="line-height:130%">45</div><div style="line-height:130%">46</div><div style="line-height:130%">47</div><div style="line-height:130%">48</div><div style="line-height:130%">49</div><div style="line-height:130%">50</div><div style="line-height:130%">51</div><div style="line-height:130%">52</div><div style="line-height:130%">53</div><div style="line-height:130%">54</div><div style="line-height:130%">55</div><div style="line-height:130%">56</div><div style="line-height:130%">57</div><div style="line-height:130%">58</div><div style="line-height:130%">59</div><div style="line-height:130%">60</div><div style="line-height:130%">61</div><div style="line-height:130%">62</div><div style="line-height:130%">63</div><div style="line-height:130%">64</div><div style="line-height:130%">65</div><div style="line-height:130%">66</div><div style="line-height:130%">67</div><div style="line-height:130%">68</div><div style="line-height:130%">69</div><div style="line-height:130%">70</div><div style="line-height:130%">71</div><div style="line-height:130%">72</div><div style="line-height:130%">73</div><div style="line-height:130%">74</div><div style="line-height:130%">75</div><div style="line-height:130%">76</div><div style="line-height:130%">77</div><div style="line-height:130%">78</div><div style="line-height:130%">79</div><div style="line-height:130%">80</div><div style="line-height:130%">81</div><div style="line-height:130%">82</div><div style="line-height:130%">83</div><div style="line-height:130%">84</div><div style="line-height:130%">85</div><div style="line-height:130%">86</div><div style="line-height:130%">87</div><div style="line-height:130%">88</div><div style="line-height:130%">89</div><div style="line-height:130%">90</div><div style="line-height:130%">91</div><div style="line-height:130%">92</div><div style="line-height:130%">93</div><div style="line-height:130%">94</div><div style="line-height:130%">95</div><div style="line-height:130%">96</div><div style="line-height:130%">97</div><div style="line-height:130%">98</div><div style="line-height:130%">99</div><div style="line-height:130%">100</div><div style="line-height:130%">101</div><div style="line-height:130%">102</div><div style="line-height:130%">103</div><div style="line-height:130%">104</div><div style="line-height:130%">105</div><div style="line-height:130%">106</div><div style="line-height:130%">107</div><div style="line-height:130%">108</div><div style="line-height:130%">109</div><div style="line-height:130%">110</div><div style="line-height:130%">111</div><div style="line-height:130%">112</div><div style="line-height:130%">113</div><div style="line-height:130%">114</div><div style="line-height:130%">115</div><div style="line-height:130%">116</div><div style="line-height:130%">117</div><div style="line-height:130%">118</div></div></td><td style="padding:6px 0;text-align:left"><div style="margin:0;padding:0;color:#f0f0f0;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important;line-height:130%"><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">package</span>&nbsp;jspEducation.task;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">import</span>&nbsp;java.io.IOException;</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">import</span>&nbsp;java.io.PrintWriter;</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">import</span>&nbsp;java.util.function.Function;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">import</span>&nbsp;javax.servlet.ServletException;</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">import</span>&nbsp;javax.servlet.annotation.WebServlet;</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">import</span>&nbsp;javax.servlet.http.HttpServlet;</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">import</span>&nbsp;javax.servlet.http.HttpServletRequest;</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">import</span>&nbsp;javax.servlet.http.HttpServletResponse;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#999999">/**</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#999999">&nbsp;*&nbsp;Servlet&nbsp;implementation&nbsp;class&nbsp;task1025</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#999999">&nbsp;*/</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">@WebServlet(&nbsp;{<span style="color:#ffd500">"/task1025"</span>&nbsp;,&nbsp;<span style="color:#ffd500">"/Task1025"</span>&nbsp;,&nbsp;<span style="color:#ffd500">"/TASK1025"</span>&nbsp;,&nbsp;<span style="color:#ffd500">"/과제1025"</span>})</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">public</span>&nbsp;<span style="color:#ff3399">class</span>&nbsp;task1025&nbsp;<span style="color:#ff3399">extends</span>&nbsp;HttpServlet&nbsp;{</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;PrintWriter&nbsp;<span style="color:#4be6fa">out</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ff3399">void</span>&nbsp;createScript(PrintWriter&nbsp;outA)&nbsp;{</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&lt;script&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;'use&nbsp;strict';"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;$(function()&nbsp;{"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;let&nbsp;product&nbsp;=&nbsp;$(\"#product\").val();"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">""</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;alert(‎\"상품명&nbsp;:&nbsp;\"&nbsp;+&nbsp;product);"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;});"</span>);&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"$(function()&nbsp;{"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;$(\"#calcBtn\").click(function()&nbsp;{"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;let&nbsp;product&nbsp;=&nbsp;$(\"#product\").val();"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;let&nbsp;price&nbsp;=&nbsp;$(\"#price\").val();"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;let&nbsp;su&nbsp;=&nbsp;$(\"#su\").val();"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;if(isNaN(price)&nbsp;||&nbsp;isNaN(su))&nbsp;{"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;alert(‎\"가격과&nbsp;수량은&nbsp;숫자로&nbsp;입력하세요!\");"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$(\"#price\").select();"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$(\"#price\").focus();"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;}"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;let&nbsp;res&nbsp;=&nbsp;price&nbsp;*&nbsp;su;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;//demo.innerHTML&nbsp;=&nbsp;product&nbsp;+&nbsp;\"의&nbsp;가격은?&nbsp;\"&nbsp;+&nbsp;res;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;let&nbsp;str&nbsp;=&nbsp;'&lt;div&nbsp;class=\"colorblue\"&gt;'+product&nbsp;+&nbsp;\"의&nbsp;가격은?&nbsp;\"&nbsp;+&nbsp;res+'&lt;/div&gt;';"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;//&nbsp;$(\"#demo\").html(str);"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;$(\"#demo\").html(str);"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;});"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"});"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&lt;/script&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;}</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ff3399">void</span>&nbsp;createStyle(PrintWriter&nbsp;outA)&nbsp;{</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&lt;style&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">".colorblue{"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"background-color:&nbsp;#aaf;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"display:&nbsp;inline-block;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"}"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&lt;/style&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;}</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ff3399">protected</span>&nbsp;<span style="color:#ff3399">void</span>&nbsp;doGet(HttpServletRequest&nbsp;request,&nbsp;HttpServletResponse&nbsp;response)&nbsp;<span style="color:#ff3399">throws</span>&nbsp;ServletException,&nbsp;IOException&nbsp;{</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;response.setContentType(<span style="color:#ffd500">"text/html;&nbsp;charset=utf-8;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;response.getWriter().append(<span style="color:#ffd500">"Served&nbsp;at:&nbsp;"</span>).append(request.getContextPath());</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>&nbsp;<span style="color:#0086b3"></span><span style="color:#ff3399">=</span>&nbsp;response.getWriter();</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&lt;!DOCTYPE&nbsp;html&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&lt;html&nbsp;lang='ko'&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&lt;head&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&lt;meta&nbsp;charset='UTF-8'&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&lt;meta&nbsp;name='viewport'&nbsp;content='width=device-width,&nbsp;initial-scale=1.0'&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&lt;title&gt;test1_선언.html&lt;/title&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&lt;link&nbsp;rel='stylesheet'&nbsp;href='https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css'&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&lt;script&nbsp;src='https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js'&gt;&lt;/script&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&lt;script&nbsp;src=\"https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js\"&gt;&lt;/script&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&lt;script&nbsp;src=\"https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js\"&gt;&lt;/script&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&lt;link&nbsp;rel=\"stylesheet\"&nbsp;href=\"https://www.w3schools.com/w3css/4/w3.css\"&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;createScript(<span style="color:#4be6fa">out</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;createStyle(<span style="color:#4be6fa">out</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&lt;/head&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&lt;body&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&lt;p&gt;&lt;br/&gt;&lt;/p&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&lt;div&nbsp;class='container'&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&lt;h2&gt;상품가격&nbsp;계산하기&lt;/h2&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&lt;form&nbsp;name='myform'&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;&lt;div&gt;상품명"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;input&nbsp;type='text'&nbsp;name='product'&nbsp;id=\"product\"&nbsp;value=\"냉장고\"&nbsp;autofocus&nbsp;class=\"form-control&nbsp;mb-3\"&nbsp;/&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;&lt;/div&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;&lt;div&gt;상품가격"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;input&nbsp;type=\"text\"&nbsp;name=\"price\"&nbsp;id=\"price\"&nbsp;value=\"1000\"&nbsp;class=\"form-control&nbsp;mb-3\"&nbsp;/&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;&lt;/div&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;&lt;div&gt;구매수량"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;input&nbsp;type=\"text\"&nbsp;name=\"su\"&nbsp;id=\"su\"&nbsp;value=\"2\"&nbsp;class=\"&nbsp;form-control&nbsp;mb-3\"&nbsp;/&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;&lt;/div&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;&lt;div&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;input&nbsp;type=\"button\"&nbsp;value=\"계산하기\"&nbsp;id=\"calcBtn\"&nbsp;class=\"btn-success&nbsp;form-control\"&nbsp;/&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&nbsp;&nbsp;&lt;/div&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&lt;/form&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&nbsp;&lt;hr/&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&nbsp;&lt;div&nbsp;id=\"demo\"&gt;&lt;/div&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&lt;/div&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&lt;/body&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"&lt;/html&gt;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;}</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;<span style="color:#ff3399">protected</span>&nbsp;<span style="color:#ff3399">void</span>&nbsp;doPost(HttpServletRequest&nbsp;request,&nbsp;HttpServletResponse&nbsp;response)&nbsp;<span style="color:#ff3399">throws</span>&nbsp;ServletException,&nbsp;IOException&nbsp;{</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;doGet(request,&nbsp;response);</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;&nbsp;&nbsp;&nbsp;}</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div><div style="padding:0 6px; white-space:pre; line-height:130%">}</div><div style="padding:0 6px; white-space:pre; line-height:130%">&nbsp;</div></div><div style="text-align:right;margin-top:-13px;margin-right:5px;font-size:9px;font-style:italic"><a href="http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4ftext-decoration:none">Colored by Color Scripter</a></div></td><td style="vertical-align:bottom;padding:0 2px 4px 0"><a href="http://colorscripter.com/info#e" target="_blank" style="text-decoration:none;color:white"><span style="font-size:9px;word-break:normal;background-color:#4f4f4f;color:white;border-radius:10px;padding:1px">cs</span></a></td></tr></table></div>"><div data-ke-class="article"><div class="colorscripter-code" style="color:#f0f0f0;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important; position:relative !important;overflow:auto"><table class="colorscripter-code-table" style="margin:0;padding:0;border:none;background-color:#272727;border-radius:4px;" cellspacing="0" cellpadding="0"><tr><td style="padding:6px;border-right:2px solid #4f4f4f"><div style="margin:0;padding:0;word-break:normal;text-align:right;color:#aaa;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important;line-height:130%"><div style="line-height:130%">1</div><div style="line-height:130%">2</div><div style="line-height:130%">3</div><div style="line-height:130%">4</div><div style="line-height:130%">5</div><div style="line-height:130%">6</div><div style="line-height:130%">7</div><div style="line-height:130%">8</div><div style="line-height:130%">9</div><div style="line-height:130%">10</div><div style="line-height:130%">11</div><div style="line-height:130%">12</div><div style="line-height:130%">13</div><div style="line-height:130%">14</div><div style="line-height:130%">15</div><div style="line-height:130%">16</div><div style="line-height:130%">17</div><div style="line-height:130%">18</div><div style="line-height:130%">19</div><div style="line-height:130%">20</div><div style="line-height:130%">21</div><div style="line-height:130%">22</div><div style="line-height:130%">23</div><div style="line-height:130%">24</div><div style="line-height:130%">25</div><div style="line-height:130%">26</div><div style="line-height:130%">27</div><div style="line-height:130%">28</div><div style="line-height:130%">29</div><div style="line-height:130%">30</div><div style="line-height:130%">31</div><div style="line-height:130%">32</div><div style="line-height:130%">33</div><div style="line-height:130%">34</div><div style="line-height:130%">35</div><div style="line-height:130%">36</div><div style="line-height:130%">37</div><div style="line-height:130%">38</div><div style="line-height:130%">39</div><div style="line-height:130%">40</div><div style="line-height:130%">41</div><div style="line-height:130%">42</div><div style="line-height:130%">43</div><div style="line-height:130%">44</div><div style="line-height:130%">45</div><div style="line-height:130%">46</div><div style="line-height:130%">47</div><div style="line-height:130%">48</div><div style="line-height:130%">49</div><div style="line-height:130%">50</div><div style="line-height:130%">51</div><div style="line-height:130%">52</div><div style="line-height:130%">53</div><div style="line-height:130%">54</div><div style="line-height:130%">55</div><div style="line-height:130%">56</div><div style="line-height:130%">57</div><div style="line-height:130%">58</div><div style="line-height:130%">59</div><div style="line-height:130%">60</div><div style="line-height:130%">61</div><div style="line-height:130%">62</div><div style="line-height:130%">63</div><div style="line-height:130%">64</div><div style="line-height:130%">65</div><div style="line-height:130%">66</div><div style="line-height:130%">67</div><div style="line-height:130%">68</div><div style="line-height:130%">69</div><div style="line-height:130%">70</div><div style="line-height:130%">71</div><div style="line-height:130%">72</div><div style="line-height:130%">73</div><div style="line-height:130%">74</div><div style="line-height:130%">75</div><div style="line-height:130%">76</div><div style="line-height:130%">77</div><div style="line-height:130%">78</div><div style="line-height:130%">79</div><div style="line-height:130%">80</div><div style="line-height:130%">81</div><div style="line-height:130%">82</div><div style="line-height:130%">83</div><div style="line-height:130%">84</div><div style="line-height:130%">85</div><div style="line-height:130%">86</div><div style="line-height:130%">87</div><div style="line-height:130%">88</div><div style="line-height:130%">89</div><div style="line-height:130%">90</div><div style="line-height:130%">91</div><div style="line-height:130%">92</div><div style="line-height:130%">93</div><div style="line-height:130%">94</div><div style="line-height:130%">95</div><div style="line-height:130%">96</div><div style="line-height:130%">97</div><div style="line-height:130%">98</div><div style="line-height:130%">99</div><div style="line-height:130%">100</div><div style="line-height:130%">101</div><div style="line-height:130%">102</div><div style="line-height:130%">103</div><div style="line-height:130%">104</div><div style="line-height:130%">105</div><div style="line-height:130%">106</div><div style="line-height:130%">107</div><div style="line-height:130%">108</div><div style="line-height:130%">109</div><div style="line-height:130%">110</div><div style="line-height:130%">111</div><div style="line-height:130%">112</div><div style="line-height:130%">113</div><div style="line-height:130%">114</div><div style="line-height:130%">115</div><div style="line-height:130%">116</div><div style="line-height:130%">117</div><div style="line-height:130%">118</div></div></td><td style="padding:6px 0;text-align:left"><div style="margin:0;padding:0;color:#f0f0f0;font-family:Consolas, 'Liberation Mono', Menlo, Courier, monospace !important;line-height:130%"><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">package</span> jspEducation.task;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">import</span> java.io.IOException;</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">import</span> java.io.PrintWriter;</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">import</span> java.util.function.Function;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">import</span> javax.servlet.ServletException;</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">import</span> javax.servlet.annotation.WebServlet;</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">import</span> javax.servlet.http.HttpServlet;</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">import</span> javax.servlet.http.HttpServletRequest;</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">import</span> javax.servlet.http.HttpServletResponse;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#999999">/**</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#999999"> * Servlet implementation class task1025</span></div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#999999"> */</span></div><div style="padding:0 6px; white-space:pre; line-height:130%">@WebServlet( {<span style="color:#ffd500">"/task1025"</span> , <span style="color:#ffd500">"/Task1025"</span> , <span style="color:#ffd500">"/TASK1025"</span> , <span style="color:#ffd500">"/과제1025"</span>})</div><div style="padding:0 6px; white-space:pre; line-height:130%"><span style="color:#ff3399">public</span> <span style="color:#ff3399">class</span> task1025 <span style="color:#ff3399">extends</span> HttpServlet {</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> PrintWriter <span style="color:#4be6fa">out</span>;</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#ff3399">void</span> createScript(PrintWriter outA) {</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" <script>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" 'use strict';"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" "</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" $(function() {"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" let product = $(\"#product\").val();"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">""</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" alert(‎\"상품명 : \" + product);"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" });"</span>); </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"$(function() {"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" "</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" $(\"#calcBtn\").click(function() {"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" let product = $(\"#product\").val();"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" let price = $(\"#price\").val();"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" let su = $(\"#su\").val();"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" "</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" if(isNaN(price) || isNaN(su)) {"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" alert(‎\"가격과 수량은 숫자로 입력하세요!\");"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" $(\"#price\").select();"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" $(\"#price\").focus();"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" return;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" }"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" let res = price * su;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" //demo.innerHTML = product + \"의 가격은? \" + res;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" let str = '<div class=\"colorblue\">'+product + \"의 가격은? \" + res+'</div>';"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" // $(\"#demo\").html(str);"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" $(\"#demo\").html(str);"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" });"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"});"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" </script>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> }</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#ff3399">void</span> createStyle(PrintWriter outA) {</div><div style="padding:0 6px; white-space:pre; line-height:130%"> outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" <style>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">".colorblue{"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"background-color: #aaf;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"display: inline-block;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"}"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> outA.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"</style>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> }</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#ff3399">protected</span> <span style="color:#ff3399">void</span> doGet(HttpServletRequest request, HttpServletResponse response) <span style="color:#ff3399">throws</span> ServletException, IOException {</div><div style="padding:0 6px; white-space:pre; line-height:130%"> response.setContentType(<span style="color:#ffd500">"text/html; charset=utf-8;"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> response.getWriter().append(<span style="color:#ffd500">"Served at: "</span>).append(request.getContextPath());</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span> <span style="color:#0086b3"></span><span style="color:#ff3399">=</span> response.getWriter();</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"<!DOCTYPE html>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"<html lang='ko'>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"<head>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" <meta charset='UTF-8'>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" <meta name='viewport' content='width=device-width, initial-scale=1.0'>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" <title>test1_선언.html</title>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" <link rel='stylesheet' href='https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css'>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" <script src='https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js'></script>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" <script src=\"https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js\"></script>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" <script src=\"https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js\"></script>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" <link rel=\"stylesheet\" href=\"https://www.w3schools.com/w3css/4/w3.css\">"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> createScript(<span style="color:#4be6fa">out</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> createStyle(<span style="color:#4be6fa">out</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"</head>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"<body>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"<p><br/></p>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"<div class='container'>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" <h2>상품가격 계산하기</h2>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" <form name='myform'>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" <div>상품명"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" <input type='text' name='product' id=\"product\" value=\"냉장고\" autofocus class=\"form-control mb-3\" />"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" </div>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" <div>상품가격"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" <input type=\"text\" name=\"price\" id=\"price\" value=\"1000\" class=\"form-control mb-3\" />"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" </div>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" <div>구매수량"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" <input type=\"text\" name=\"su\" id=\"su\" value=\"2\" class=\" form-control mb-3\" />"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" </div>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" <div>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" <input type=\"button\" value=\"계산하기\" id=\"calcBtn\" class=\"btn-success form-control\" />"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" </div>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" </form>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" <hr/>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">" <div id=\"demo\"></div>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"</div>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"</body>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#4be6fa">out</span>.<span style="color:#4be6fa">println</span>(<span style="color:#ffd500">"</html>"</span>);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> }</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%"> <span style="color:#ff3399">protected</span> <span style="color:#ff3399">void</span> doPost(HttpServletRequest request, HttpServletResponse response) <span style="color:#ff3399">throws</span> ServletException, IOException {</div><div style="padding:0 6px; white-space:pre; line-height:130%"> doGet(request, response);</div><div style="padding:0 6px; white-space:pre; line-height:130%"> }</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div><div style="padding:0 6px; white-space:pre; line-height:130%">}</div><div style="padding:0 6px; white-space:pre; line-height:130%"> </div></div><div style="text-align:right;margin-top:-13px;margin-right:5px;font-size:9px;font-style:italic"><a href="http://colorscripter.com/info#e" target="_blank" style="color:#4f4f4ftext-decoration:none">Colored by Color Scripter</a></div></td><td style="vertical-align:bottom;padding:0 2px 4px 0"><a href="http://colorscripter.com/info#e" target="_blank" style="text-decoration:none;color:white"><span style="font-size:9px;word-break:normal;background-color:#4f4f4f;color:white;border-radius:10px;padding:1px">cs</span></a></td></tr></table></div></div></div>
<!-- -->]]>
카페 게시글
검색이 허용된 게시물입니다.
서승원
20231015 과제
서승원
추천 0
조회 23
23.10.25 22:53
댓글 1
다음검색
첫댓글 내용 잘 봤습니다. 수고하셨습니다.