title 클래스 opacity에 관련해서 질문있습니다
181
작성한 질문수 16
전에 질문 드리긴 했었는데, 제가 너무 질문을 이해하지 못하게 설명을 했었었네요 ㅜㅜ 죄송합니다.
강의 13분 쯤에 main-container 안에 title 을 넣는 부분이 나오는데
이곳에서 main-container의 특성으로 opacity 를 적용했었습니다.
그리고 title도 만들었는데요.
main-container 안에 title이 있어서 그런건지
title에 있는 문자들이 opacity의 영향을 받습니다.
예를 들어 '광고보다 강의에 집중합니다' 라는 글자의 색을#fff 로 적용해도
main-container의 opacity를 변경해서 적용해 주는 순간 '광고보다 강의에 집중합니다' 라는 글자 또한 opacity의 영향을 받습니다.
opacity = 0.1;로 설정하면 글자는 거의 희미하게 보이구요.
잘 따라왔다고 생각했는데 이 부분만 다르게 적용되네요...
답변 1
0
안녕하세요.
main-container 안에 title 이 있기 때문에, 영향을 받는 것은 어쩔수 없어보입니다. 영향을 받겠다 라는 의미로, 그 안에 위치한 것이니까요. 만약, opacity 에 영향을 받지 않게 하려면, main-container 밖에 작성을 해야할 것으로 보여요. 그렇지 않다면, 아예 코드를 float 등을 사용해서, position 을 absolute 등으로 해서, main-container 와 완전히 분리되어, 그 위에 보여지게끔 해야할 것 같아요.
제가 작성했을 때는, main-container 에 어두운 배경색을 쓰되, opacity 를 0.9 로 해서 살짝만 그 뒤의 이미지가 보여지게 하고, 이 안에 0.9 정도면, 하얀색의 타이틀이 살짝 투명하더라도, 크게 영향을 받지 않게 해서 그렇게 작성하였습니다.
따라서, 말씀하신 것은 제가 드린 코드와 이미지 그대로라면, 의도한 바로 이해를 하고 있습니다.
다음과 같이 동일하게 0.9 로 적용을 하고 있습니다.
교육기간을 연장할 수 있는지 문의드립니다.
0
50
1
메일 확인부탁드립니다
0
69
1
CodeSandbox Vanilla 질문있습니다
0
69
1
part1을 수강하지 않아도 지장이 없다 하셨는데
0
118
1
강의에 관해 문의 드립니다.
0
105
1
메일확인 부탁드립니다.
0
96
1
14강 - 72,73번 강의 영상이 동일한거 같습니다.
0
118
1
Symbol 관련 테스트 코드 실행 결과 문의
0
153
1
호환성 관련 태그
0
125
1
강의화면은 index.js인데 왜 샌드박스코드에서는 index.mjs인지 궁금해요
0
154
1
강의화면은 index.js인데 왜 샌드박스코드에서는 index.mjs인지 궁금해요
0
151
1
div id="highlighter"가 강의화면에는 없는데 왜 샌드박스파일에는 있는지 궁금해요
0
93
1
강의화면에 height 가 vh가 아닌 vw라고 나와있는데 뭐가맞는거죠
0
126
1
메일 확인 부탁드립니다.
0
154
1
메일 확인 부탁드립니다
0
154
1
특별한 형태의 javascript배열에서
0
143
1
메일 확인부탁드립니다!
0
170
1
codesandbox 업데이트..
0
151
1
pdf 파일에 있는 링크주소로 들어가지지가 않습니다.
0
274
2
강의에서 알려주신 Properties for the flex container 복습 사이트, 검색 발견되어서 공유드립니다~
0
157
1
removeEventlistener 를 왜 해주어야 하는지
0
233
1
100vw 관련 질문
0
346
2
VS CODE html:5 <tab>기능이 안됩니다
0
359
1
[모던웹페이지 만들기9](1:40)class-desc 카드부분관련
0
257
2