inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

파이널 코딩테스트 : 프론트엔드

컨테이너 & 타이틀 스타일

[카드게임] 카드게임 타이틀 부분 질문있습니다.

232

뿡치

작성한 질문수 3

0

타이틀 부분 스타일링 부분에서 질문이 있습니다.

강의 2분50초경에서 .tit-image의 overflow속성을 hidden으로 지정해주는 것은 html파일에서 작성한 card game 텍스트를 숨겨주기 위함이라고 하셨습니다. 

어차피 이미지로 구현하는데 텍스트를 적어주는 이유가 뭔지 궁금합니다! 가려지도록 하지만 텍스트도 적어주는 다른 이유가 있나요? 제가 생각한 이유는 웹 접근성을 위해서 적어놓기만 하고, overflow와 text-indent를 지정해주어서 아예 보여주지 않는 것이라고 이해했는데 이게 맞을까요?

좋은 강의 감사합니다!!

코테 준비 같이 해요!

답변 1

1

-J-

안녕하세요 뿡치님! 반갑습니다 :)

넵 말씀하신 텍스트를 굳이 작성하면서도 숨겨주는 이유는 웹접근성 때문입니다!

해당 이미지를 img 태그로 작성하지 않고 요소의 백그라운드 이미지로 작업하고 있지요?

백그라운드 이미지로 작업하면 img 태그의 alt 속성처럼 이미지에 대한 설명을 제공할 방법이 없기 때문에 

영상과 같은 방법으로 구현한겁니다. 이렇게 하면 스크린리더를 이용하는 사용자들은 해당이미지의 정보를 음성으로 파악할 수 있지요!

좋은 질문 감사합니다! 

답변이 도움이 되길 바라겠습니다 :)

0

뿡치

명확하게 이해됐습니다! 친절한 답변 감사합니다!!!

뮤직플레이>인트로 컴포넌트 작성강의에 관련해서 궁금한게있어서 문의드립니다!

0

347

1

cart 페이지 피그마 로직관련 질문드립니다!

0

457

1

createRootElement가 static인 이유가 무엇인가요?

0

358

1

11번째 파트 강의 정말 잘보고 있습니다!

0

245

1

좋아요 기능 만드는 강의가 완전하지 않아요!

0

270

1

[카드게임] 타이틀 display부분 질문 있습니다!

2

269

1

git public레포로 코드와 제공해주신 리소스들 올려도되나요?

0

291

1

items

1

336

2

album 컴포넌트 스크립트까지 다 따라 쳤는데 화면에 아예 안뜨네요..ㅜㅜ

0

269

1

SPA 섹션 강의 완성 예정일이 궁급합니다.

0

300

1

다음 구현 부분은 아직 강의 공개가 안된걸까요 ??

0

184

1

추가문제 강의 업로드

0

219

1

강의자료는 어디서 다운받을 수 있나요

0

264

1

index.js를 빼는 이유

1

284

1

파코테4 - 뮤직플레이 화면이 없어지고 li가 떠야하는데 안뜨네요.. 빨간줄이 뜬 부분은 오타가 아닌데 오타라고 뜨고 렌더쪽 문제 해결하는 법을 모르겠네요

0

314

2

reset.css 는 어디에 설정 하나요?

0

474

2

노션 링크 질문입니다.

0

206

1

이미지 하나가 움직임이 좀 부자연스럽

0

276

1

CSS 업데이트 부탁드립니다.

1

181

1

궁금한점이 있어서 질문드립니다!

1

311

2

난이도 별 3개가 많은데 어떤순서가 좋을까요?

2

188

1

질문입니다.

2

218

1

리액트로 구현

1

269

2

overflow: hidden;

1

167

1