KEYBOARD FUNCTION

ピンチインして
画面を合わせてください

araisan_cu

QWERTYUIOP⇐
   ASDFGHJKL　➡　
⇑ZXCVBNM !  ? ⇑
?123Ctrl/                            .com.?123
QWERTYU IOP

ASDFGHJKL

   ⇑   ZXCVBNM  <>  

         Ctrl                                .com. ?123

KeyPress-A

Please press A key

　　
　　

KeyPress-B

Button

Button

Button

KeyPress-C

Button

Button

Button

awesome!

wonderful!

amazing!

wonderful

KeyPress-D

Button

7

Button

7

Button

7

KeyPress-E➡,F,G

E➡,F,G key

KeyPress-H

Press H key

KeyPress-I

I

KeyPress-J

J

Cat Tweets

サ大オンやる

猫

吾輩はアライさんである。名前はまだない。 アライさんは地デジのアンテナを取り付けるため家の屋根に上った。 いままで自分を犬だと思い込んでいたアライさんは、屋根など上った事などない。 強風が吹き荒れる中なんとか屋根の中心に辿り着きアンテナを...

KeyPress-K

Press K key
Accordion Slide

KeyPress-L

L

『border-widthプロパティ』

border-width: 1px;

border-width: thick;

border-width: 1px 4px 8px 12px;

『border-styleプロパティ』

border-style: solid;

border-style: double;

border-style: dashed;

border-style: dotted;

border-style: groove;

border-style: ridge;

border-style: inset;

border-style: outset;

border-style: double dotted solid ridge;

KeyPress-M

M

『border-colorプロパティ』

border-color: #0bd;

border-color: tomato;

border-color: tan #0bd tomato #000;

『borderプロパティ』

border-bottom: 2px solid #0bd;

border: 5px dotted tomato;

border-bottom: 15px solid #f9e900;

KeyPress-N

N

『border-radiusプロパティ』

⓵

⓶

boder-radius: 20px① 40px② 60px③ 80px④ / 10px① 30px② 50px③ 100px④;

⓷

⓸

KeyPress-O

KEY-O


KeyPress-P

SDGs
Please press P key

プレゼン参考資料【TED】http://www.ted.com/translate/languages/ja

KeyPress-Q

Qを押して

授業の満足度

とても満足した 35.8%


満足した            47.9%


どちらともいえない


満足していない

KeyPress-R

R

CyberUniversity

CyberUniversity CyberUniversity CyberUniversity CyberUniversity

CyberUniversity

KeyPress-S

S


クラス名::before {content: "テキスト";}


疑似要素の使い方


クラス名::after {content: "テキスト";}


KeyPress-T

T

\おすすめ/

.クラス名 { animation: アニメーションの名前 2s 3; }
@keyframes アニメーションの名前 {
0%, 50%, 100% {top: 0;}
25% {top: -.8rem;}
75% {top: -.5rem;} }

\CyberUniversity/

KeyPress-U

U

0 0,

100% 10%,

clip-path: polygon(0 0, 100% 10%, 100% 90%, 0 100%);

CU

2019年3月15日 履修登録を開始しました
2020年9月27日 オンやるのアドベントカレンダーに参加しました
2020年11月　　 Web制作を開始
2021年10月3日 オンやる開催決定！

100% 90%,

0 100%,

KeyPress-V

V

CyberUniversity

2030. 5. 5. 14:00 - 16:00

オンラインで行っているWebサイト制作の勉強会、WCB Conference。 今回は最新のCSSテクニックとデザイントレンドを中心に紹介します。 参加料金は無料！お気軽にご参加ください。

KeyPress-W

W

MouseHover

clip-path: polygon(0 0, 470px 0, 100% 50%, 470px 100%, 0 100%);

transition: background 1s, width 2s ease-in-out;

transition: background 1s, width 2s ease-in-out;

KeyPress-X

X
グラデーションカラー

#238CCC⇒#C5E5EE

#E6551E⇒#F5BC2D

#64B44C⇒#FFFB7F

#E83E43⇒#F7B187

#99C66A⇒#67C0D7

#E62434⇒#93291D

#CBD5EE⇒#EEEEEE

#67BFD5⇒#F7CD39

#FFE5AE⇒#FFFFFF

#9E549C⇒#392152

#EB5D7E⇒#7C539D

#C49E54⇒#FEEFEA

#F0CBA5⇒#ED6B82

#CA654B⇒#543221

#20AAD8⇒#402C86

#D9A7C7⇒#FEFADE

KeyPress-Y

Y

CyberUniversity

ONやる

KeyPress-Z

Z

ひよこの足1 ひよこの胴体 ひよこの足2

最後まで見ていただきありがとうございました
おしまい