✍ 📁 🙈 🙉 🙊

2018年3月9日星期五

特殊符號

</style> 
<div id="CC1637442"></div> <center>
<div id="Mid1637442"> 
<div id="heart" class="Mit" >愛心符號 
<div class="it" data-cat="heart">ღ ❣ ❤ ❥ ❦ ❧ ♣ ♦ ♥ ♠ </div></div> 
<div id="hand" class="Mit">手符號 
<div class="it" data-cat="hand">☚ ☛ ☜ ☝ ☞ ☟ ✌ ✍ </div></div> 
<div id="chess" class="Mit">國際象棋符號 
<div class="it" data-cat="chess">♔ ♕ ♖ ♗ ♘ ♙ ♚ ♛ ♜ ♝ ♞ ♟ </div></div> 
<div id="music" class="Mit">音符符號 
<div class="it" data-cat="music">♩ ♪ ♫ ♬ ♭ ♮ ♯ </div> </div> 
<div id="weather" class="Mit">天氣符號 
<div class="it" data-cat="weather">ϟ ☀ ☁ ☂ ☃ ☄ ☉ ☼ ☽ ☾ ♁ ♨ ❄ ❅ ❆ </div></div> 
<div id="culture" class="Mit">文化符號 
<div class="it" data-cat="culture">☠ ☤ ☥ ☦ ☧ ☨ ☩ ☪ ☫ ☬ ☮ ☭ ☯ ☸ ☽ ☾ ♕ ♚ ♛ ✙ ✚ ✛ ✜ ✝ ✞ ✟ ✠ ✡ ✢ 卍 卐 </div></div> 
<div id="office" class="Mit">辦公室的符號 
<div class="it" data-cat="office">‱ № ℗ ℠ ℡ ℀ ℁ ℅ ℆ ⅍ ⌚ ⌛ ☊ ☎ ☏ ✁ ✂ ✃ ✄ ✆ ✇ ✈ ✉ ✍ ✎ ✏ ✐ ✑ ✒ ™ © ® ‰ § ¶ </div></div> 
<div id="tech" class="Mit">技術符號 
<div class="it" data-cat="tech">⏎ ⇧ ⇪ ⌂ ⌘ ☢ ☣ ⌥ ⎋ ⌫  ᴴᴰ </div></div> 
<div id="constellation" class="Mit">星座符號 
<div class="it" data-cat="constellation">♈ ♉ ♊ ♋ ♌ ♍ ♎ ♏ ♐ ♑ ♒ ♓ </div> </div> 
<div id="tick" class="Mit">打勾符號 
<div class="it" data-cat="tick">ˇ ∛ ∜ ☐ ☑ ☒ ✓ ✔ ✗ ✘ ∨ √ </div></div> 
<div id="poker" class="Mit">撲克符號 
<div class="it" data-cat="poker">♡ ♢ ♤ ♧ ♣ ♦ ♥ ♠ </div> </div> 
<div id="face" class="Mit">人的符號 
<div class="it" data-cat="face">☹ ☺ ☻ ☿ ♀ ♂ ツ ㋡ 웃 유 </div> </div> 
<div id="star" class="Mit">星星符號 
<div class="it" data-cat="star">★ ☆ ✡ ✦ ✧ ✩ ✪ ✫ ✬ ✭ ✮ ✯ ✰ ⁂ ⁎ ⁑ ☸ ✢ ✣ ✤ ✥ ✱ ✲ ✳ ✴ ✵ ✶ ✷ ✸ ✹ ✺ ✻ ✼ ✽ ✾ ✿ ❀ ❁ ❂ ❃ ❇ ❈ ❉ ❊ ❋ </div></div> 
<div id="arrow" class="Mit">箭頭符號 
<div class="it" data-cat="arrow">↕ ↖ ↗ ↘ ↙ ↚ ↛ ↜ ↝ ↞ ↟ ↠ ↡ ↢ ↣ ↤ ↥ ↦ ↧ ↨ ↩ ↪ ↫ ↬ ↭ ↮ ↯ ↰ ↱ ↲ ↳ ↴ ↶ ↷ ↸ ↹ ↺ ↻ ↼ ↽ ↾ ↿ ⇀ ⇁ ⇂ ⇃ ⇄ ⇅ ⇆ ⇇ ⇈ ⇉ ⇊ ⇋ ⇌ ⇍ ⇎ ⇏ ⇕ ⇖ ⇗ ⇘ ⇙ ⇚ ⇛ ⇜ ⇝ ⇞ ⇟ ⇠ ⇡ ⇢ ⇣ ⇤ ⇥ ⇦ ⇧ ⇨ ⇩ ⇪ ⌅ ⌆ ⌤ ⏎ ▶ ☇ ☈ ☊ ☋ ☌ ☍ ➔ ➘ ➙ ➚ ➛ ➜ ➝ ➞ ➟ ➠ ➡ ➢ ➣ ➤ ➥ ➦ ➧ ➨ ➩ ➪ ➫ ➬ ➭ ➮ ➯ ➱ ➲ ➳ ➴ ➵ ➶ ➷ ➸ ➹ ➺ ➻ ➼ ➽ ➾ ⤴ ⤵ ↵ ↓ ↔ ← → ↑ </div></div> 
<div id="graphic" class="Mit">圖形符號 
<div class="it" data-cat="rectangle">ˍ ∎ ⊞ ⊟ ⊠ ⊡ ⋄ ⎔ ▀ ▁ ▂ ▃ ▄ ▅ ▆ ▇ █ ▉ ▊ ▋ ▋ ▌ ▍ ▎ ▏ ▐ ░ ▒ ▓ ▔ ■ □ ▢ ▣ ▤ ▥ ▦ ▧ ▨ ▩ ▪ ▫ ▬ ▭ ▮ ▯ ▰ ▱ ► ◄ ◆ ◇ ◈ ◘ ◙ ◚ ◛ ◢ ◣ ◤ ◥ ◧ ◨ ◩ ◪ ◫ ☖ ☗ ❏ ❐ ❑ ❒ ❖ ❘ ❙ ❚ ◊ </div> </div> 
<div id="traingle" class="Mit">三角符號 
<div class="it" data-cat="traingle">∆ ⊿ ▲ △ ▴ ▵ ▶ ▷ ▸ ▹ ► ▻ ▼ ▽ ▾ ▿ ◀ ◁ ◂ ◃ ◄ ◅ ◢ ◣ ◤ ◥ ◬ ◭ ◮ ∇ </div></div> 
<div id="line" class="Mit">線段符號 
<div class="it" data-cat="line">` ˊ ᐟ ‐ ‑ ‒ ― ⁃ ≣ ⋐ ⋑ ⋒ ⋓ ⌒ ⌜ ⌝ ⌞ ⌟ ⎯ ─ ━ │ ┃ ┄ ┅ ┆ ┇ ┈ ┉ ┊ ┋ ┌ ┍ ┎ ┏ ┐ ┑ ┒ ┓ └ └ ┕ ┖ ┗ ┘ ┙ ┚ ┛ ├ ├ ┝ ┞ ┟ ┠ ┡ ┢ ┣ ┤ ┥ ┦ ┧ ┨ ┩ ┪ ┫ ┬ ┭ ┮ ┯ ┰ ┱ ┲ ┳ ┴ ┵ ┶ ┷ ┸ ┹ ┺ ┻ ┼ ┽ ┾ ┿ ╀ ╁ ╂ ╃ ╄ ╅ ╆ ╇ ╈ ╉ ╊ ╋ ╌ ╍ ╎ ╏ ═ ═ ║ ╒ ╓ ╔ ╔ ╔ ╕ ╕ ╖ ╖ ╗ ╗ ╘ ╙ ╚ ╚ ╛ ╛ ╜ ╜ ╝ ╝ ╞ ╟ ╟ ╠ ╡ ╡ ╢ ╢ ╣ ╣ ╤ ╤ ╥ ╥ ╦ ╦ ╧ ╧ ╨ ╨ ╩ ╩ ╪ ╪ ╫ ╬ ╬ ╭ ╮ ╯ ╰ ╱ ╲ ╳ ╴ ╵ ╶ ╷ ╸ ╹ ╺ ╻ ╼ ╽ ╾ ╿ ▏ ▕ ◜ ◝ ◞ ◟ ◠ ◡ ☰ ☱ ☲ ☳ ☴ ☵ ☶ ☷ ✕ ≡ ⌈ ⌊ — ⌉ ⌋ </div> </div> 
<div id="circle" class="Mit">圓形符號 
<div class="it" data-cat="circle">⊖ ⊘ ⊙ ⊚ ⊛ ⊜ ⊝ ◉ ○ ◌ ◍ ◎ ● ◐ ◑ ◒ ◓ ◔ ◕ ◖ ◗ ◦ ◯ ❍ ⦿ ⊕ ⊗ </div></div> 
<div id="math" class="Mit">數學符號 
<div class="it" data-cat="math">¼ ½ ¾ ⅐ ⅑ ⅒ ⅓ ⅔ ⅕ ⅖ ⅗ ⅘ ⅙ ⅚ ⅛ ⅜ ⅝ ⅞ ⅟ ↉ ∟ ∬ ∭ ∮ ∵ ∷ ≦ ≧ ╳ ✕ ✖ ✚ ﹢ ﹣ ﹤ ﹥ ％ ＋ － ／ ＝ ∧ ∠ ∩ ∪ ° ÷ ≡ ≥ ∞ ∫ ≤ ≠ ∨ ‰ ‱ ⊥ π ± √ ∑ ∴ × </div> </div> 
<div id="unit" class="Mit">單位符號 
<div class="it" data-cat="unit">℃ ℉ ㎎ ㎏ ㎜ ㎝ ㎞ ㎡ ㏄ ㏎ ㏑ ㏒ ㏕ ° </div></div> 
<div id="subsupscript" class="Mit">下標及上標 
<div class="it" data-cat="subsupscript">¹ ² ³ ⁰ ⁱ ⁴ ⁵ ⁶ ⁷ ⁸ ⁹ ⁺ ⁻ ⁼ ⁽ ⁾ ⁿ ₀ ₁ ₂ ₃ ₄ ₅ ₆ ₇ ₈ ₉ ₊ ₋ ₌ ₍ ₎ ₐ ₑ ₒ ₓ ₔ </div></div> 
<div id="number" class="Mit">數字符號 
<div class="it" data-cat="number">Ⅰ Ⅱ Ⅲ Ⅳ Ⅴ Ⅵ Ⅶ Ⅷ Ⅸ Ⅹ Ⅺ Ⅻ ⅰ ⅱ ⅲ ⅳ ⅴ ⅵ ⅶ ⅷ ⅸ ⅹ ⅺ ⅻ ① ② ③ ④ ⑤ ⑥ ⑦ ⑧ ⑨ ⑩ ⓵ ⓶ ⓷ ⓸ ⓹ ⓺ ⓻ ⓼ ⓽ ⓾ ⑴ ⑵ ⑶ ⑷ ⑸ ⑹ ⑺ ⑻ ⑼ ⑽ ⓪ ❶ ❷ ❸ ❹ ❺ ❻ ❼ ❽ ❾ ❿ ㈠ ㈡ ㈢ ㈣ ㈤ ㈥ ㈦ ㈧ ㈨ ㈩ ㊀ ㊁ ㊂ ㊃ ㊄ ㊅ ㊆ ㊇ ㊈ ㊉ ０ １ ２ ３ ４ ５ ６ ７ ８ ９ </div></div> 
<div id="lang" class="Mit">語言符號 
<div class="it" data-cat="latin">ą č Ĥ ħ ĩ Ň Ř Ť Ŵ Ž ⒜ ⒝ ⒞ ⒟ ⒠ ⒡ ⒢ ⒣ ⒤ ⒥ ⒦ ⒧ ⒨ ⒩ ⒪ ⒫ ⒬ ⒭ ⒮ ⒯ ⒰ ⒱ ⒲ ⒳ ⒴ ⒵ Ⓐ Ⓑ Ⓒ Ⓓ Ⓔ Ⓕ Ⓖ Ⓗ Ⓘ Ⓙ Ⓚ Ⓛ Ⓜ Ⓝ Ⓞ Ⓟ Ⓠ Ⓡ Ⓢ Ⓣ Ⓤ Ⓥ Ⓦ Ⓧ Ⓨ Ⓩ ⓐ ⓑ ⓒ ⓓ ⓔ ⓕ ⓖ ⓗ ⓘ ⓙ ⓚ ⓛ ⓜ ⓝ ⓞ ⓟ ⓠ ⓡ ⓢ ⓣ ⓤ ⓥ ⓦ ⓧ ⓨ ⓩ Ａ Ｂ Ｃ Ｄ Ｅ Ｆ Ｇ Ｈ Ｉ Ｊ Ｋ Ｌ Ｍ Ｎ Ｏ Ｐ Ｑ Ｒ Ｓ Ｔ Ｕ Ｖ Ｗ Ｘ Ｙ Ｚ ａ ｂ ｃ ｄ ｅ ｆ ｇ ｈ ｉ ｊ ｋ ｌ ｍ ｎ ｏ ｐ ｑ ｒ ｓ ｔ ｕ ｖ ｗ ｘ ｙ ｚ á â æ à å ã ä ç é ê è ð ë í î ì ï ñ ó ô ò ø õ ö ß þ ú û ù ü ý ÿ </div> </div> 
<div id="chinese" class="Mit">中國符號 
<div class="it" data-cat="chinese">㊊ ㊋ ㊌ ㊍ ㊎ ㊏ ㊐ ㊑ ㊒ ㊓ ㊔ ㊕ ㊖ ㊗ ㊘ ㊙ ㊚ ㊛ ㊜ ㊝ ㊞ ㊟ ㊠ ㊡ ㊢ ㊣ ㊤ ㊥ ㊦ ㊧ ㊨ ㊩ ㊪ ㊫ ㊬ ㊭ ㊮ ㊯ ㊰ </div> </div> 
<div id="japanese" class="Mit">日本的符號 
<div class="it" data-cat="japanese">ぁ あ ぃ い ぅ う ぇ え ぉ お か が き ぎ く ぐ け げ こ ご さ ざ し じ す ず せ ぜ そ ぞ た だ ち ぢ っ つ づ て で と ど な に ぬ ね の は ば ぱ ひ び ぴ ふ ぶ ぷ へ べ ぺ ほ ぼ ぽ ま み む め も ゃ や ゅ ゆ ょ よ ら り る れ ろ ゎ わ ゐ ゑ を ん ゔ ゕ ゖ ゚ ゛ ゜ ゝ ゞ ゟ ゠ ァ ア ィ イ ゥ ウ ェ エ ォ オ カ ガ キ ギ ク グ ケ ゲ コ ゴ サ ザ シ ジ ス ズ セ ゼ ソ ゾ タ ダ チ ヂ ッ ツ ヅ テ デ ト ド ナ ニ ヌ ネ ノ ハ バ パ ヒ ビ ピ フ ブ プ ヘ ベ ペ ホ ボ ポ マ ミ ム メ モ ャ ヤ ュ ユ ョ ヨ ラ リ ル レ ロ ヮ ワ ヰ ヱ ヲ ン ヴ ヵ ヶ ヷ ヸ ヹ ヺ ・ ー ヽ ヾ ヿ ㍐ ㍿ </div> </div> 
<div id="korean" class="Mit">韓國符號 
<div class="it" data-cat="korean">ㄱ ㄲ ㄳ ㄴ ㄵ ㄶ ㄷ ㄸ ㄹ ㄺ ㄻ ㄼ ㄽ ㄾ ㄿ ㅀ ㅁ ㅂ ㅃ ㅄ ㅅ ㅆ ㅇ ㅈ ㅉ ㅊ ㅋ ㅌ ㅍ ㅎ ㅏ ㅐ ㅑ ㅒ ㅓ ㅔ ㅕ ㅖ ㅗ ㅘ ㅙ ㅚ ㅛ ㅜ ㅝ ㅞ ㅟ ㅠ ㅡ ㅢ ㅥ ㅦ ㅧ ㅨ ㅩ ㅪ ㅫ ㅬ ㅭ ㅮ ㅯ ㅰ ㅱ ㅲ ㅳ ㅴ ㅵ ㅶ ㅷ ㅸ ㅹ ㅺ ㅻ ㅼ ㅽ ㅾ ㅿ ㆀ ㆁ ㆂ ㆃ ㆄ ㆅ ㆆ ㆇ ㆈ ㆉ ㆊ </div> </div> 
<div id="greek" class="Mit">希臘符號 
<div class="it" data-cat="greek">α β χ δ ε η γ ι κ λ μ ν ω ο φ π ψ ρ σ τ θ υ ξ ζ </div></div> 
<div id="punctuation" class="Mit">標點符號 
<div class="it" data-cat="punctuation">˙ ‥ ‧ ‵ ‵ ❛ ❜ ❝ ❞ 、 。 〃 「 」 『 』 〝 〞 ︰ ︰ ﹁ ﹂ ﹃ ﹄ ﹐ ﹒ ﹔ ﹔ ﹕ ！ ＃ ＄ ％ ＆ ＊ ， ． ： ； ？ ＠ ～ • … ¿ “ ‘ · ′ ” ’ </div></div> 
<div id="brackets" class="Mit">括號符號 
<div class="it" data-cat="brackets">〈 〈 〉 《 》 「 」 『 』 【 】 〔 〕 ︵ ︶ ︷ ︸ ︹ ︺ ︻ ︼ ︽ ︽ ︾ ︿ ﹀ ﹁ ﹁ ﹂ ﹃ ﹄ ﹙ ﹙ ﹚ ﹛ ﹜ ﹝ ﹞ ﹤ ﹥ （ ） ＜ ＞ ｛ ｛ ｝ </div></div> 
<div id="currency" class="Mit">貨幣符號 
<div class="it" data-cat="currency">₮ ৲ ৳ ௹ ฿ ៛ ₠ ₡ ₢ ₣ ₤ ₥ ₦ ₧ ₨ ₩ ₪ ₫ ₭ ₯ ₰ ₱ ₲ ₳ ₴ ₵ ￥ ﷼ ¢ ¤ € ƒ £ ¥ </div></div> </div></center>

2018年3月5日星期一

body  {  -webkit-animation: BMC 25s infinite linear;
          -moz-animation: BMC 25s infinite linear;
          -o-animation: BMC 25s infinite linear;
          -ms-animation: BMC 25s infinite linear;  }

@-webkit-keyframes BMC {
10% {background: linear-gradient(to top right, #ADD8E6, #00FFFF, #40E0D0, #FAEBD7, #FAEBD7, #FFDEAD, #9932CC, #87CEFA );} 
20% {background: linear-gradient(to top right, #00FFFF, #40E0D0, #FAEBD7, #FAEBD7, #FFDEAD, #9932CC, #87CEFA, #ADD8E6 );} 
30% {background: linear-gradient(to top right, #40E0D0, #FAEBD7, #FAEBD7, #FFDEAD, #9932CC, #87CEFA, #ADD8E6, #00FFFF );} 
40% {background: linear-gradient(to top right, #FAEBD7, #FAEBD7, #FFDEAD, #9932CC, #87CEFA, #ADD8E6, #00FFFF, #40E0D0 );} 
50% {background: linear-gradient(to top right, #FAEBD7, #FFDEAD, #9932CC, #87CEFA, #ADD8E6, #00FFFF, #40E0D0, #FAEBD7 );} 
60% {background: linear-gradient(to top right, #FFDEAD, #9932CC, #87CEFA, #ADD8E6, #00FFFF, #40E0D0, #FAEBD7, #FAEBD7 );}
70% {background: linear-gradient(to top right, #9932CC, #87CEFA, #ADD8E6, #00FFFF, #40E0D0, #FAEBD7, #FAEBD7, #FFDEAD );}
80% {background: linear-gradient(to top right, #87CEFA ,#ADD8E6, #00FFFF, #40E0D0, #FAEBD7, #FAEBD7, #FFDEAD, #9932CC );}
 } 
</style>

@-webkit-keyframes BMC {
10% {background: linear-gradient(to bottom right, #ADD8E6, #00FFFF, #40E0D0, #FAEBD7, #FAEBD7, #FFDEAD, #9932CC, #87CEFA );} 
20% {background: linear-gradient(to bottom right, #00FFFF, #40E0D0, #FAEBD7, #FAEBD7, #FFDEAD, #9932CC, #87CEFA, #ADD8E6 );} 
30% {background: linear-gradient(to bottom right, #40E0D0, #FAEBD7, #FAEBD7, #FFDEAD, #9932CC, #87CEFA, #ADD8E6, #00FFFF );} 
40% {background: linear-gradient(to bottom right, #FAEBD7, #FAEBD7, #FFDEAD, #9932CC, #87CEFA, #ADD8E6, #00FFFF, #40E0D0 );} 
50% {background: linear-gradient(to bottom right, #FAEBD7, #FFDEAD, #9932CC, #87CEFA, #ADD8E6, #00FFFF, #40E0D0, #FAEBD7 );} 
60% {background: linear-gradient(to bottom right, #FFDEAD, #9932CC, #87CEFA, #ADD8E6, #00FFFF, #40E0D0, #FAEBD7, #FAEBD7 );}
70% {background: linear-gradient(to bottom right, #9932CC, #87CEFA, #ADD8E6, #00FFFF, #40E0D0, #FAEBD7, #FAEBD7, #FFDEAD );}
80% {background: linear-gradient(to bottom right, #87CEFA ,#ADD8E6, #00FFFF, #40E0D0, #FAEBD7, #FAEBD7, #FFDEAD, #9932CC );}
 } 
</style>

CSS cursor 滑鼠游標設定

滑鼠游標在設計上扮演一個很重要的功能，必須暗示使用者可以進行的操作。
CSS 中 cursor 這個屬性用來決定滑鼠移到上面時會怎麼顯示，實際去查了發現滑鼠游標的屬性居然有 20 種左右！

滑鼠游標設定 style="cursor:pointer;" 或 css aa{cursor:pointer}

cursor:auto

cursor:cell

cursor:context-menu

cursor:col-resize

cursor:copy

cursor:crosshair

cursor:default

cursor:e-resize

cursor:ew-resize

cursor:grab

cursor:grabbing

cursor:help

cursor:move

cursor:n-resize

cursor:ne-resize

cursor:nesw-resize

cursor:ns-resize

cursor:nw-resize

cursor:nwse-resize

cursor:no-drop

cursor:none

cursor:not-allowed

cursor:pointer

cursor:progress

cursor:row-resize

cursor:s-resize

cursor:se-resize

cursor:sw-resize

cursor:text

cursor:url()

cursor:vertical-text

cursor:w-resize

cursor:wait

cursor:zoom-in

cursor:zoom-out

cursor:initial

#CSS cursor 滑鼠游標設定

CSS cursor 滑鼠游標設定

滑鼠游標設定 style="cursor:pointer;" 或 css aa{cursor:pointer}

cursor:auto

cursor:cell

cursor:context-menu

cursor:col-resize

cursor:copy

cursor:crosshair

cursor:default

cursor:e-resize

cursor:ew-resize

cursor:grab

cursor:grabbing

cursor:help

cursor:move

cursor:n-resize

cursor:ne-resize

cursor:nesw-resize

cursor:ns-resize

cursor:nw-resize

cursor:nwse-resize

cursor:no-drop

cursor:none

cursor:not-allowed

cursor:pointer

cursor:progress

cursor:row-resize

cursor:s-resize

cursor:se-resize

cursor:sw-resize

cursor:text

cursor:url()

cursor:vertical-text

cursor:w-resize

cursor:wait

cursor:zoom-in

cursor:zoom-out

cursor:initial

JavaScript Date() 日期與時間

<table border="2" class ="Cc" >
<tbody>
<caption>JavaScript Date() 日期與時間</caption> 
<tr><td width="350px">
Date.now() 
</td><td>
 Date_now
</td></tr> 
<tr><td>new Date().getTime() 
</td><td>
 new_Date
</td></tr> 
<tr><td>Date() 
</td><td>
 new_Date
</td></tr> <tr><td>new Date().getFullYear()+"年"; 
</td><td>
 new_Date
</td></tr> 
<tr><td>new Date().getMonth()+1+"月"; 
</td><td>
 new_Date
</td></tr> 
<tr><td>new Date().getDate()+"日"; 
</td><td>
 new_Date
</td></tr> 
<tr><td>
V= ["日","一,"二","三","四","五","六"]; 
V [ new Date().getDay() ]; 
</td><td>
 new_Date
</td></tr> 
<tr><td>new Date().getHours()+"時"; 
</td><td>
 getHours
</td></tr> <tr><td> 
new Date().getMinutes()+"分"; 
</td><td>
 getHours
</td></tr> <tr><td> new Date().getSeconds() +"秒"; 
</td><td>
 getHours
</td></tr> 
</tbody></table>

qid = setTimeout ( Ram,  1000 );

}
Ram();

</script>

<center> age calculator 計算年齡 <select style="font-size:16px;" id="Month" onchange="MD(1)"><option value="01">Jan</option><option value="02">Feb</option><option value="03">Mar</option><option value="04">Apr</option><option value="05">May</option><option value="06">Jun</option><option value="07">Jul</option><option value="08">Aug</option><option value="09">Sep</option><option value="10">Oct</option><option value="11">Nov</option><option value="12">Dec</option></select> <select style="font-size:16px;" id="DD" onchange="MD()"></select> <select style="font-size:16px;" id="Yy" onchange="MD(1)"></select> <div id="DP" style="font-size:30px;" ></div></center> <script>function SD(){ Month.options.selectedIndex =new Date().getMonth() ; var Tyy = new Date().getFullYear() ; for (i = Tyy-1 ; i > Tyy -100 ; i--){ var option = document.createElement("option"); option.text = parseInt(i)+1 ; Yy.add(option); } Yy.options.selectedIndex = 0; MD(); } SD(); function MD(xx){ /** 获取某个月的总天数 **/ var date=new Date( Yy.options[Yy.selectedIndex].text , Month.options.selectedIndex + 1 , 0); /** 获取某个月的总天数 **/ var DDD = DD.options.selectedIndex; var days=date.getDate(); var length = DD.options.length; for (i = length-1; i >= 0; i--) {DD.options[i] = null;} for (i = 0; i < days ; i++){ var option = document.createElement("option"); option.text = parseInt(i)+1 ; DD.add(option); } if(DDD == -1) {DD.options.selectedIndex=new Date().getDate()-1} else{DD.options.selectedIndex=DDD;} var ageD = Yy.options[Yy.selectedIndex].text + Month.options[Month.selectedIndex].value+ DD.options[DD.selectedIndex].text ; Show(ageD.toString() ) } function Show(d){ var today=new Date(),year=d.substr(0,4),jmonth=parseInt(d.substr(4,2),10)-1,date=d.substr(6,2); today.setHours(12,0,0,0); var hy=hm=hd=0; while (new Date(+year+1,jmonth,date).valueOf() < today.valueOf()) {year++;hy++;} while (new Date(year,+jmonth+1,date).valueOf() < today.valueOf()) {jmonth++;hm++;} while (new Date(year,jmonth,+date+1).valueOf() < today.valueOf()) {date++;hd++;} document.getElementById("DP").innerHTML=hy + " year , " + hm + " month , " + hd + " day "; } </script>

<center>/** 獲取某個月的總天數 **/ <select style="font-size:16px;" id="Month" onchange="MD(1)"><option value="01">Jan</option><option value="02">Feb</option><option value="03">Mar</option><option value="04">Apr</option><option value="05">May</option><option value="06">Jun</option><option value="07">Jul</option><option value="08">Aug</option><option value="09">Sep</option><option value="10">Oct</option><option value="11">Nov</option><option value="12">Dec</option></select> <select style="font-size:16px;" id="Yy" onchange="MD(1)"></select> <div id="DP" style="font-size:30px;" ></div></center> <script>function SD(){ Month.options.selectedIndex =new Date().getMonth() ; var Tyy = new Date().getFullYear() ; for (i = Tyy-1 ; i > Tyy -100 ; i--){ var option = document.createElement("option"); option.text = parseInt(i)+1 ; Yy.add(option); } Yy.options.selectedIndex = 0; MD(); } SD(); function MD(xx){ /** 获取某个月的总天数 **/ var xx = new Date(Yy.options[Yy.selectedIndex].text , Month.options.selectedIndex + 1 , 0 ); xx = xx.getDate(); DP.innerHTML= Yy.options[Yy.selectedIndex].text + " Year " + (Month.options.selectedIndex+1) + " Month " + "共有" + xx + "days"; /** 获取某个月的总天数 **/ } </script>

Edit

#html getDate() #html getFullYear() #html getHours() #html getMilliseconds() #html getSeconds() #html getTime() #html Date.now() #html new Date() #html Date() #html 日期與時間() #html UTC()() #script getDate() #script getFullYear() #script getHours() #script getMilliseconds() #script getSeconds() #script getTime() #script Date.now() #script new Date() #script Date() #script 日期與時間() #script UTC()

2018年3月4日星期日

DIV position:fixed-CSS固定物件

讓物件固定在上方，或是網頁的某一個地方，這時候我們就會需要用到CSS裡position:fixed這個語法。
position是絕對位置，可以讓圖片或區塊固定在你所想要的地方，fixed則是根據瀏覽器視窗來定位。
position: 值;

值	描述
absolute	生成絕對定位的元素，相對於 static 定位以外的第一個父元素進行定位。元素的位置通過 "left", "top", "right" 以及 "bottom" 屬性進行規定。
fixed	生成絕對定位的元素，相對於瀏覽器窗口進行定位。元素的位置通過 "left", "top", "right" 以及 "bottom" 屬性進行規定。
relative	生成相對定位的元素，相對於其正常位置進行定位。因此，"left:20" 會向元素的 LEFT 位置添加 20 像素。
static	默認值。沒有定位，元素出現在正常的流中（忽略 top, bottom, left, right 或者 z-index 聲明）。
inherit	規定應該從父元素繼承 position 屬性的值。

#html position:absolute #html position:fixed #html position:relative #html position:static #html position:inherit

DIV position:fixed-CSS固定物件

值	描述
absolute	生成絕對定位的元素，相對於 static 定位以外的第一個父元素進行定位。元素的位置通過 "left", "top", "right" 以及 "bottom" 屬性進行規定。
fixed	生成絕對定位的元素，相對於瀏覽器窗口進行定位。元素的位置通過 "left", "top", "right" 以及 "bottom" 屬性進行規定。
relative	生成相對定位的元素，相對於其正常位置進行定位。因此，"left:20" 會向元素的 LEFT 位置添加 20 像素。
static	默認值。沒有定位，元素出現在正常的流中（忽略 top, bottom, left, right 或者 z-index 聲明）。
inherit	規定應該從父元素繼承 position 屬性的值。

DIV 在左上角設定數 position: fixed; top:0px; bottom:auto; right:auto; left:0px;。
DIV 在左下角設定數 position: fixed; top:auto; bottom:0px; right:auto; left:0px;。
DIV 在右上角設定數 position: fixed; top:0px; bottom:auto; right:0px; left:auto;。
DIV 在右下角設定數 position: fixed; top:0px; bottom:0px; right:0px; left:0px;。
如果 px 為負數 DIV 會走出視窗外。你可以修改下列 HTML 看看結果。

CSS content

CSS content 插入內容。

CSS 伪元素選擇器 : content: url

CSS content

CSS content 插入內容。

CSS 伪元素選擇器 : content: url

DIV CSS z-index

做出區塊或圖片的堆疊效果，必須搭配上 position 語法來設定區塊的位置，才能做出疊在一起的效果，HTML 區塊 div1 先寫，而 div2 div3 div4 寫在 div1 後面，因此 div2 重疊在 div1 上方。
要改變 div1 及 div2 重疊次序，我們可以在 div 加入 z-index 元素，那個 z-index 的值越大重疊越靠高位置，如下列 div1 z-index 為1，div2 z-index 為1，div1 顯示在 div2 上方。
在 style CSS 設定 #div1:after,#div2:after,#div3:after,#div4:after {content: " z-index=0"}，在 div 內文字後加入 z-index=0。

再 style CSS 設定 #div1:hover:after,#div2:hover:after,#div3:hover:after,#div4:hover:after{content: " z-index=1"}，當滑鼠移到 div 上 div 內文字後加入 z-index=1。

再 style CSS 設定 #div1:hover,#div2:hover,#div3:hover,#div4:hover{z-index: 1}，當滑鼠移到 div 上 div 設定 z-index=1。

, , , , ,

DIV CSS z-index

z-index 屬性設定了一個定位元素及其後代元素或 flex 項目的 z-order。當元素之間重疊的時候， z-index 較大的元素會覆蓋較小的元素在上層進行顯示。
HTML 區塊 div1 先寫，而 div2 div3 div4 寫在 div1 後面，因此 div2 重疊在 div1 上方。
要改變 div1 及 div2 重疊次序，我們可以在 div 加入 z-index 元素，那個 z-index 的值越大重疊越靠高位置，如下列 div1 z-index 為1，div2 z-index 為1，div1 顯示在 div2 上方。
在 style CSS 設定 #div1:after,#div2:after,#div3:after,#div4:after {content: " z-index=0"}，在 div 內文字後加入 z-index=0。

再 style CSS 設定 #div1:hover:after,#div2:hover:after,#div3:hover:after,#div4:hover:after{content: " z-index=1"}，當滑鼠移到 div 上 div 內文字後加入 z-index=1。

再 style CSS 設定 #div1:hover,#div2:hover,#div3:hover,#div4:hover{z-index: 1}，當滑鼠移到 div 上 div 設定 z-index=1。

#HTML 堆疊效果 #CSS z-index

2018年3月3日星期六

尾部連結 hbbb(xx)

訂閱：文章 (Atom)

2018年3月9日 星期五

2018年3月5日 星期一

CSS cursor 滑鼠游標設定

CSS cursor 滑鼠游標設定

JavaScript Date() 日期與時間

2018年3月4日 星期日

DIV position:fixed-CSS固定物件

DIV position:fixed-CSS固定物件

CSS content 插入內容。

CSS content 插入內容。

DIV CSS z-index

DIV CSS z-index

2018年3月3日 星期六

2018年3月9日星期五

2018年3月5日星期一

2018年3月4日星期日

2018年3月3日星期六