Tool/Chrome DevTools

๐ŸŒ ํฌ๋กฌ ๋ธŒ๋ผ์šฐ์ € ํ™”๋ฉด ๋ถ„ํ•  ๋ฐฉ๋ฒ•

์ธํŒŒ_ 2022. 6. 4. 11:34

Tab Resize-ํฌ๋กฌ ํ™”๋ฉด ๋ถ„ํ• 

๋ธŒ๋ผ์šฐ์ € ํ™”๋ฉด ๋ถ„ํ• 

ํ™”๋ฉด ๋ถ„ํ•  ๊ธฐ๋Šฅ์€ ์—ฌ๋Ÿฌ ํ”„๋กœ๊ทธ๋žจ์„ ๋™์‹œ์— ๋„์›Œ์„œ ์ž‘์—…ํ•˜์—ฌ ์ƒ์‚ฐ์„ฑ์„ ์˜ฌ๋ฆฌ๋Š” ๋งŽ์ด ์• ์šฉ๋˜๋Š” ๊ธฐ๋Šฅ์ด๋‹ค.

๊ตฌ๊ธ€๋งํ•ด์„œ ์›น๋ฌธ์„œ๋ฅผ ์ฐพ๋Š” ์ผ์ด ๋นˆ๋ฒˆํ•ด์ง€๋ฉด์„œ ํ•˜๋‚˜์˜ ๋ธŒ๋ผ์šฐ์ € ์ฐฝ์—์„œ ํƒญ์„ ์ด๋ฆฌ์ €๋ฆฌ ์ด๋™ํ•˜๋Š” ๊ฒƒ์ด ๋ถˆํŽธํ•ด์„œ ์ฐพ์•„๋ณด๋‹ค ๊ดœ์ฐฎ์€ ํฌ๋กœ๋ฏธ์›€ ์ต์Šคํ…์…˜์„ ์ฐพ์•„ ์†Œ๊ฐœํ•ด๋ณธ๋‹ค.

 

ํฌ๋กฌ ํ™”๋ฉด ๋ถ„ํ• ์ด๋ผ๊ณ  ๊ฑฐ์ฐฝํ•˜๊ฒŒ ์จ๋†“์•˜์ง€๋งŒ, ์‚ฌ์‹ค ๊ทธ๋ƒฅ ๋ธŒ๋ผ์šฐ์ €์ฐฝ ํ•˜๋‚˜ ์ƒ์„ฑํ•ด์„œ ๋ถ„ํ• ํ•˜๋Š” ๋‹จ์ˆœํ•œ ๊ธฐ๋Šฅ์ด๋‹ค.

๊ทธ๋ž˜๋„ ์ง์ ‘ ์†์œผ๋กœ ์ผ์ผํžˆ ๊ฐ€๋กœ๋Š” ์ค„์ด๊ณ  ์„ธ๋กœ๋Š” ๋Š˜๋ฆฐ๋‹ค์Œ ๋ฐฐ์น˜ํ•˜๋Š” ์ด๋Ÿฐ ์ž‘์—…์„ ํ•˜๋‚˜ํ•˜๋‚˜ ์ฐฝ์„ ์กฐ์ •ํ•˜๋Š” ๊ฒƒ๋ณด๋‹ค, ํด๋ฆญ ํ•œ๋ฒˆ์œผ๋กœ ์ž๋™์œผ๋กœ ๋น„์œจ์„ ์กฐ์ •ํ•ด์ค˜์„œ ํŽธํ•˜๊ฒŒ ํ™”๋ฉด ๋ถ„ํ• ์„ ํ•  ์ˆ˜ ์žˆ๋‹ค๋Š” ์ ์€ ๊ดœ์ฐฎ๋‹ค.


Tab Resize

 

Tab Resize - split screen layouts

Split Screen made easy. Resize the CURRENT tab and tabs to the RIGHT into layouts on separate windows. w/ Multi Monitor Support.

chrome.google.com

 

ํฌ๋กฌ ์ต์Šคํ…์…˜์„ ์„ค์น˜ํ•˜๋ฉด ํฌ๋กฌ ๋ธŒ๋ผ์šฐ์ € ์šฐ์ธก ์ƒ๋‹จ์— ๋‹ค์Œ๊ณผ ๊ฐ™์€ ์•„์ด์ฝ˜์ด ์ƒ์„ฑ๋  ๊ฒƒ์ด๋‹ค.

Tab Resize-ํฌ๋กฌ ํ™”๋ฉด ๋ถ„ํ• 

์•„์ด์ฝ˜์„ ํด๋ฆญํ•˜๋ฉด ๋ ˆ์ด์•„์›ƒ ํ™”๋ฉด์ด ๋‚˜ํƒ€๋‚˜๋Š”๋ฐ, 4 ๋ถ„ํ•  ํ™”๋ฉด๋ฟ๋งŒ ์•„๋‹ˆ๋ผ ์„ธ๋กœ 2 ๋ถ„ํ• , ๊ฐ€๋กœ 2 ๋ถ„ํ• , ์ปค์Šคํ…€ ๋ถ„ํ•  ๋“ฑ ๋‹ค์–‘ํ•œ ๊ธฐ๋Šฅ์„ ๊ฐ€์ง€๊ณ  ์žˆ๋‹ค.

๊ฐ„๋‹จํ•œ ํด๋ฆญ๋งŒ์œผ๋กœ ๋ฐ”๋กœ ํƒญ์„ ํ™”๋ฉด ๋ถ„ํ•  ํ• ์ˆ˜ ์žˆ๋‹ค.

Tab Resize-ํฌ๋กฌ ํ™”๋ฉด ๋ถ„ํ• 

์˜ต์…˜๋„ ๊ฐ„๋‹จํ•˜๋‹ค.

  • Single Tab ์˜ต์…˜ : ์ฐฝ ๋ถ„ํ• ์€ ํ•˜๋˜, ๋”ฑ ํ•œ ๊ฐœ์˜ ์ฐฝ๋งŒ ๋‚˜ํƒ€๋‚˜๊ณ  ๋‚˜๋จธ์ง€ ๊ณต๊ฐ„์€ ๋น„์–ด์žˆ๋Š” ์ฑ„๋กœ ๊ณต๊ฐ„๋ถ„ํ• 
  • Left Align, Right Align ์˜ต์…˜ : ๋ง ๊ทธ๋Œ€๋กœ ์ฐฝ์„ ๋ถ„ํ• ํ•  ๋•Œ ๊ธฐ์ค€์ ์„ ์™ผ์ชฝ์œผ๋กœ ์žก๋А๋ƒ ์˜ค๋ฅธ์ชฝ์œผ๋กœ ์„ค์ •ํ•˜๋А๋ƒ๋Š” ์˜ต์…˜

 

์ปค์Šคํ…€ ๋ถ„ํ• 

๋งŒ์ผ 4:3 ๊ฐ™์ด ์‚ฌ์šฉ์ž ์ง€์ • ๋ถ„ํ•  ํ”„๋ฆฌ์…‹์„ ๋งŒ๋“ค๊ณ  ์‹ถ๋‹ค๋ฉด, ํ™”๋ฉด ๊ฐ€์šด๋ฐ + ๋ฒ„ํŠผ์„ ๋ˆ„๋ฅด๋ฉด ๋œ๋‹ค.

Tab Resize-ํฌ๋กฌ ํ™”๋ฉด ๋ถ„ํ• 

 

๋ฒ„ํŠผ์„ ๋ˆ„๋ฅด๋ฉด ๋‚˜ํƒ€๋‚˜๋Š” ์ฐฝ์—์„œ,

Fixed ๋ฒ„ํŠผ์„ ๋ˆ„๋ฅด๋ฉด ์ „์ฒด ํ™”๋ฉด์„ ์ง€์ •ํ•œ ์—ด๊ณผ ํ–‰์˜ ์ˆ˜๋Œ€๋กœ ๋ถ„ํ• ํ•  ์ˆ˜ ์žˆ๋‹ค.

Scaled ๋ฒ„ํŠผ์„ ๋ˆ„๋ฅด๋ฉด ํ™”๋ฉด์„ ์ง€์ •ํ•œ ๋น„์œจ๋กœ ๊ฐ€๋กœ๋ถ„ํ• , ์„ธ๋กœ๋ถ„ํ•  ํ•  ์ˆ˜ ์žˆ๋‹ค.

Tab Resize-ํฌ๋กฌ ํ™”๋ฉด ๋ถ„ํ• Tab Resize-ํฌ๋กฌ ํ™”๋ฉด ๋ถ„ํ•