r701 vs r702
11
{{{#!style
2
.text-hover td:hover {
3
background-color: #0f0
4
}
5
.text-hover td:hover {
6
color: #00f
7
}
8
}}}
2
.red td:hover {
3
background-color: red;
4
color: white;
95
10
{{{#!wiki class="text-hover"
11
||<tableclass=text-hover> dddddddd [[color|{{{#!wiki class="text-hover"
12
하이퍼링크 텍스트}}}]] ||}}}
136
147
158
16
셀의 텍스트와 배경이 마우스를 호버 했을때 색이 변하게 하고 싶은데 텍스트의 하이퍼 링크가 걸린 경우 하이퍼 링크 내에 class를 넣어야 하는데 이렇게 하며 셀과 텍스트가 호버를 각각 감지해서 동시에 호버 감지가 안되 셀 배경색과 텍스트의 색을 호버로 동시에 바뀌게 만들려면 어떻게 만들어야 됨?
179
1810
1911
12
13
14
15
16
17
}
18
@theseed-dark-mode {
19
.red td:hover {
20
background-color: green;
21
}
22
23
}
24
}}}
25
||<tableclass=red> 내용 || 내용2 || 내용3 ||
26
27
2028
{{{#!style
21
/* 테이블 클래스(hover-table) 하위에 있는 모든 셀(td)에 호버 효과 적용 */
22
.hover-table td:hover {
23
background-color: #f00;
24
transition: 0.2s; /* 부드러운 전환 효과 (선택사항) */
29
.key td:hover {
30
background-color:#f5f5f5;
2531
}
32
@theseed-dark-mode {
33
.key td:hover {
34
background-color:#000;
35
}
36
}
2637
}}}
27
2838
{{{#!wiki style="margin: 0 auto; width: min(1000px, 100%); text-align: center; word-break: keep-all"
29
||<tablewidth=100%><tablebordercolor=#000,#666><bgcolor=#000> {{{+1 '''[[QWERTY|QWERTY]] [[틀:QWERTY 키보드|키보드 글쇠]]'''}}} ||
39
||<tablewidth=100%><tablebordercolor=#000,#666><bgcolor=#000><tableclass=key> {{{+1 '''[[QWERTY|{{{#fff QWERTY}}}]] [[틀:QWERTY 키보드|{{{#fff 키보드 글쇠}}}]]'''}}} ||
3040
||<bgcolor=#fff,#111>{{{#!wiki style="margin: 0 -10px -5px; min-height: calc(1.5em + 5px)"
3141
{{{#!folding [ 펼치기 · 접기 (PC를 통한 열람 권장) ]
3242
##)] 편집기 하이라이팅 버그 때문에 둔 주석.
3343
{{{#!wiki style="margin: -5px -1px -11px; overflow: hidden"
3444
{{{#!wiki style="margin: -16px -0px -12px"
35
||<tablewidth=100%><tablebgcolor=#fff,#111><width=2.7%><rowbgcolor=#dcdcdc,#383b40>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.8%>||
36
||<-2>[[Esc 키|Esc]] ||<-2><bgcolor=#dcdcdc,#383b40> ||<-2>[[기능 키#F1|F1]] ||<-2>[[기능 키#F2|F2]] ||<-2>[[기능 키#F3|F3]] ||<-2>[[기능 키#F4|F4]] ||<bgcolor=#dcdcdc,#383b40> ||<-2>[[F5#|F5]] ||<-2>[[F6|F6]] ||<-2>[[F7|F7]] ||<-2>[[F8|F8]] ||<bgcolor=#dcdcdc,#383b40> ||<-2>[[F9|F9]] ||<-2>[[F10#s-1|F10]] ||<-2>[[F11|F11]] ||<-2>[[F12|F12]] ||<bgcolor=#dcdcdc,#383b40>||<-2> [[Print Screen|PrtSc]][br][[Print Screen#s-3|SysRq]] ||<-2> [[Scroll Lock|ScrLk]] ||<-2> [[Pause Break|Pause[br]Break]] ||
45
||<tablewidth=100%><tablebgcolor=#fff,#111><width=2.7%><rowbgcolor=#dcdcdc,#383b40>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.7%>||<width=2.8%>||
46
||<-2>[[Esc 키|{{{#000,#fff Esc}}}]] ||<-2><bgcolor=#dcdcdc,#383b40> ||<-2>[[기능 키#F1|{{{#000,#fff F1}}}]] ||<-2>[[기능 키#F2|{{{#000,#fff F2}}}]] ||<-2>[[기능 키#F3|{{{#000,#fff F3}}}]] ||<-2>[[기능 키#F4|{{{#000,#fff F4}}}]] ||<bgcolor=#dcdcdc,#383b40> ||<-2>[[F5#|{{{#000,#fff F5}}}]] ||<-2>[[F6|{{{#000,#fff F6}}}]] ||<-2>[[F7|{{{#000,#fff F7}}}]] ||<-2>[[F8|{{{#000,#fff F8}}}]] ||<bgcolor=#dcdcdc,#383b40> ||<-2>[[F9|{{{#000,#fff F9}}}]] ||<-2>[[F10#s-1|{{{#000,#fff F10}}}]] ||<-2>[[F11|{{{#000,#fff F11}}}]] ||<-2>[[F12|{{{#000,#fff F12}}}]] ||<bgcolor=#dcdcdc,#383b40>||<-2> [[Print Screen|{{{#000,#fff PrtSc}}}]][br][[Print Screen#s-3|{{{#000,#fff SysRq}}}]] ||<-2> [[Scroll Lock|{{{#000,#fff ScrLk}}}]] ||<-2> [[Pause Break|{{{#000,#fff Pause[br]Break}}}]] ||
3747
||<-37><bgcolor=#dcdcdc,#383b40>||
38
||<-2>[[물결표|~]] [br] [[다이어크리틱#s-5.2|`]] ||<-2>[[느낌표|!]] [br] [[1|1]] ||<-2>[[@|@]] [br] [[2|2]] ||<-2>[[\#|\#]] [br] [[3|3]] ||<-2>[[달러|$]] [br] [[4|4]] ||<-2>[[%|%]] [br] [[5|5]] ||<-2>[[^|^]] [br] [[6|6]] ||<-2>[[&|&]] [br] [[7|7]] ||<-2>[[*|*]] [br] [[8|8]] ||<-2>[[괄호#s-2.1|(]] [br] [[9|9]] ||<-2>[[괄호#s-2.1|)]] [br] [[0|0]] ||<-2>[[_|_]] [br] [[-|-]] ||<-2>[[덧셈|+]] [br] [[=|=]] ||<-4> [[백스페이스|← Backspace]][br](Delete) ||<bgcolor=#dcdcdc,#383b40>||<-2> [[Insert#s-2|Ins]] ||<-2> [[홈#s-2.5|Home]] ||<-2> [[Page up|PgUp]] ||
39
||<-3> [[Tab 키|⇆ Tab]] ||<-2>[[Q|Q]] ||<-2>[[W|W]] ||<-2>[[E|E]] ||<-2>[[R|R]] ||<-2>[[T|T]] ||<-2>[[Y|Y]] ||<-2>[[U|U]] ||<-2>[[I|I]] ||<-2>[[O|O]] ||<-2>[[P|P]] ||<-2>[[괄호#s-2.2|{]] [br] [[괄호#s-2.3|[]] ||<-2>[[괄호#s-2.2|}]] [br] [[괄호#s-2.3|]]] ||<-3>[[\||\|]][br][[\\|\\]] ||<bgcolor=#dcdcdc,#383b40>||<-2> [[삭제#s-1|Del]] ||<-2> [[END#s-5|End]] ||<-2> [[Page down|PgDn]] ||
40
||<-4> [[Caps Lock|⇪ Caps Lock]] ||<-2>[[A|A]] ||<-2>[[S|S]] ||<-2>[[D|D]] ||<-2>[[F|F]] ||<-2>[[G|G]] ||<-2>[[H|H]] ||<-2>[[J|J]] ||<-2>[[K|K]] ||<-2>[[L|L]] ||<-2>[[쌍점|:]][br][[쌍반점|;]] ||<-2>[[따옴표|"]][br][[아포스트로피|']] ||<-4> [[엔터 키|Enter ↲]][br](Return) ||<-5><bgcolor=#dcdcdc,#383b40>||<-2> [[Num Lock|Num]] ||
41
||<-5> [[Shift 키|⇧ Shift]] ||<-2>[[Z|Z]] ||<-2>[[X|X]] ||<-2>[[C|C]] ||<-2>[[V|V]] ||<-2>[[B|B]] ||<-2>[[N|N]] ||<-2>[[M|M]] ||<-2>[[부등호|<]][br][[쉼표|,]] ||<-2>[[부등호|>]][br][[마침표|.]] ||<-2>[[물음표|?]][br][[..//|/]] ||<-5> [[Shift 키|⇧ Shift]] ||<-3><#dcdcdc,#383b40>||<-2>[[방향|↑]]||<-2><bgcolor=#dcdcdc,#383b40>||
42
||<-3> [[Ctrl 키|Ctrl]] [br] ([[FN|fn]]) ||<-2> [[FN(키)|Fn]] [br] ([[컨트롤|^]]) ||<-2> [[윈도우 키|[[파일:Windows_11_Icon_(print).svg|width=15px&theme=light]][[파일:Windows_11_Icon_(dark).svg|width=15px&theme=dark]]]] [br] ([[옵션#s-5|⌥]]) ||<-2> [[Alt 키|Alt]] [br] ([[커맨드|⌘]]) ||<-12> [[스페이스 바|Space]] ||<-2> [[Alt 키|Alt]] [br] ([[커맨드|⌘]]) ||<-2> [[윈도우 키|[[파일:Windows_11_Icon_(print).svg|width=15px&theme=light]][[파일:Windows_11_Icon_(dark).svg|width=15px&theme=dark]]]] [br] ([[옵션#s-5|⌥]]) ||<-2> [[Windows Copilot|[[파일:Windows Copilot 로고.svg|width=20]]]] [br] [[메뉴 키|(Menu)]] ||<-3> [[Ctrl 키|Ctrl]] ||<bgcolor=#dcdcdc,#383b40>||<-2>[[방향|←]]||<-2>[[방향|↓]]||<-2>[[방향|→]]||
48
||<-2>[[물결표|{{{#000,#fff ~}}}]] [br] [[다이어크리틱#s-5.2|{{{#000,#fff `}}}]] ||<-2>[[느낌표|{{{#000,#fff !}}}]] [br] [[1|{{{#000,#fff 1}}}]] ||<-2>[[@|{{{#000,#fff @}}}]] [br] [[2|{{{#000,#fff 2}}}]] ||<-2>[[\#|{{{#000,#fff \#}}}]] [br] [[3|{{{#000,#fff 3}}}]] ||<-2>[[달러|{{{#000,#fff $}}}]] [br] [[4|{{{#000,#fff 4}}}]] ||<-2>[[%|{{{#000,#fff %}}}]] [br] [[5|{{{#000,#fff 5}}}]] ||<-2>[[^|{{{#000,#fff ^}}}]] [br] [[6|{{{#000,#fff 6}}}]] ||<-2>[[&|{{{#000,#fff &}}}]] [br] [[7|{{{#000,#fff 7}}}]] ||<-2>[[*|{{{#000,#fff *}}}]] [br] [[8|{{{#000,#fff 8}}}]] ||<-2>[[괄호#s-2.1|{{{#000,#fff (}}}]] [br] [[9|{{{#000,#fff 9}}}]] ||<-2>[[괄호#s-2.1|{{{#000,#fff )}}}]] [br] [[0|{{{#000,#fff 0}}}]] ||<-2>[[_|{{{#000,#fff _}}}]] [br] [[-|{{{#000,#fff -}}}]] ||<-2>[[덧셈|{{{#000,#fff +}}}]] [br] [[=|{{{#000,#fff =}}}]] ||<-4> [[백스페이스|{{{#000,#fff ← Backspace}}}]][br]{{{#000,#fff (Delete)}}} ||<bgcolor=#dcdcdc,#383b40>||<-2> [[Insert#s-2|{{{#000,#fff Ins}}}]] ||<-2> [[홈#s-2.5|{{{#000,#fff Home}}}]] ||<-2> [[Page up|{{{#000,#fff PgUp}}}]] ||
49
||<-3> [[Tab 키|{{{#000,#fff ⇆ Tab}}}]] ||<-2>[[Q|{{{#000,#fff Q}}}]] ||<-2>[[W|{{{#000,#fff W}}}]] ||<-2>[[E|{{{#000,#fff E}}}]] ||<-2>[[R|{{{#000,#fff R}}}]] ||<-2>[[T|{{{#000,#fff T}}}]] ||<-2>[[Y|{{{#000,#fff Y}}}]] ||<-2>[[U|{{{#000,#fff U}}}]] ||<-2>[[I|{{{#000,#fff I}}}]] ||<-2>[[O|{{{#000,#fff O}}}]] ||<-2>[[P|{{{#000,#fff P}}}]] ||<-2>[[괄호#s-2.2|{{{#000,#fff \{}}}]] [br] [[괄호#s-2.3|{{{#000,#fff \[}}}]] ||<-2>[[괄호#s-2.2|{{{#000,#fff \}}}}]] [br] [[괄호#s-2.3|{{{#000,#fff \]}}}]] ||<-3>[[\||{{{#000,#fff \|}}}]][br][[\\|{{{#000,#fff \\}}}]] ||<bgcolor=#dcdcdc,#383b40>||<-2> [[삭제#s-1|{{{#000,#fff Del}}}]] ||<-2> [[END#s-5|{{{#000,#fff End}}}]] ||<-2> [[Page down|{{{#000,#fff PgDn}}}]] ||
50
||<-4> [[Caps Lock|{{{#000,#fff ⇪ Caps Lock}}}]] ||<-2>[[A|{{{#000,#fff A}}}]] ||<-2>[[S|{{{#000,#fff S}}}]] ||<-2>[[D|{{{#000,#fff D}}}]] ||<-2>[[F|{{{#000,#fff F}}}]] ||<-2>[[G|{{{#000,#fff G}}}]] ||<-2>[[H|{{{#000,#fff H}}}]] ||<-2>[[J|{{{#000,#fff J}}}]] ||<-2>[[K|{{{#000,#fff K}}}]] ||<-2>[[L|{{{#000,#fff L}}}]] ||<-2>[[쌍점|{{{#000,#fff :}}}]][br][[쌍반점|{{{#000,#fff ;}}}]] ||<-2>[[따옴표|{{{#000,#fff "}}}]][br][[아포스트로피|{{{#000,#fff '}}}]] ||<-4> [[엔터 키|{{{#000,#fff Enter ↲}}}]][br](Return) ||<-5><bgcolor=#dcdcdc,#383b40>||<-2> [[Num Lock|{{{#000,#fff Num}}}]] ||
51
||<-5> [[Shift 키|{{{#000,#fff ⇧ Shift}}}]] ||<-2>[[Z|{{{#000,#fff Z}}}]] ||<-2>[[X|{{{#000,#fff X}}}]] ||<-2>[[C|{{{#000,#fff C}}}]] ||<-2>[[V|{{{#000,#fff V}}}]] ||<-2>[[B|{{{#000,#fff B}}}]] ||<-2>[[N|{{{#000,#fff N}}}]] ||<-2>[[M|{{{#000,#fff M}}}]] ||<-2>[[부등호|{{{#000,#fff <}}}]][br][[쉼표|{{{#000,#fff ,}}}]] ||<-2>[[부등호|{{{#000,#fff >}}}]][br][[마침표|{{{#000,#fff .}}}]] ||<-2>[[물음표|{{{#000,#fff ?}}}]][br][[..//|{{{#000,#fff /}}}]] ||<-5> [[Shift 키|{{{#000,#fff ⇧ Shift}}}]] ||<-3><#dcdcdc,#383b40>||<-2>[[방향|{{{#000,#fff }}}]]||<-2><bgcolor=#dcdcdc,#383b40>||
52
||<-3> [[Ctrl 키|{{{#000,#fff Ctrl}}}]] [br] {{{#000,#fff (}}}[[FN|{{{#000,#fff fn}}}]]{{{#000,#fff )}}} ||<-2> [[FN(키)|{{{#000,#fff Fn}}}]] [br] {{{#000,#fff (}}}[[컨트롤|{{{#000,#fff ^}}}]]{{{#000,#fff )}}} ||<-2> [[윈도우 키|{{{#000,#fff [[파일:Windows_11_Icon_(print).svg|width=15px&theme=light]][[파일:Windows_11_Icon_(dark).svg|width=15px&theme=dark]]}}}]] [br] {{{#000,#fff (}}}[[옵션#s-5|{{{#000,#fff }}}]]{{{#000,#fff )}}} ||<-2> [[Alt 키|{{{#000,#fff Alt}}}]] [br] {{{#000,#fff (}}}[[커맨드|{{{#000,#fff }}}]]{{{#000,#fff )}}} ||<-12> [[스페이스 바|{{{#000,#fff Space}}}]] ||<-2> [[Alt 키|{{{#000,#fff Alt}}}]] [br] {{{#000,#fff (}}}[[커맨드|{{{#000,#fff }}}]]{{{#000,#fff )}}} ||<-2> [[윈도우 키|{{{#000,#fff [[파일:Windows_11_Icon_(print).svg|width=15px&theme=light]][[파일:Windows_11_Icon_(dark).svg|width=15px&theme=dark]]}}}]] [br] {{{#000,#fff (}}}[[옵션#s-5|{{{#000,#fff }}}]]{{{#000,#fff )}}} ||<-2> [[Windows Copilot|[[파일:Windows Copilot 로고.svg|width=20]]]] [br] [[메뉴 키|{{{#000,#fff (Menu)}}}]] ||<-3> [[Ctrl 키|{{{#000,#fff Ctrl}}}]] ||<bgcolor=#dcdcdc,#383b40>||<-2>[[방향|{{{#000,#fff }}}]]||<-2>[[방향|{{{#000,#fff }}}]]||<-2>[[방향|{{{#000,#fff }}}]]||
4353
||<-37><bgcolor=#dcdcdc,#383b40>||}}}}}}}}}}}}||}}}
4454
4555
......
4959
|| 셀 3 || 셀 4 ||
5060
5161
52
{{{#!style
53
.key:hover {
54
background-color:#f00;
55
}
56
}}}
5762
63
64
5865
||<class=key> 내용 ||
5966
6067
이런식으로 되니까 이런식으로 만들라고 이 문법보다 테이블의 셀의 갯수가 많아지면 일일이 <class=key>를 넣을 순 없잖아?
......