Q&A

CSS에서 html[lang=en] 구문 관련

2022.01.19 23:05
612
0
CMS/프레임워크 Rhymix 2.0
개발 언어 PHP 7.4

안녕하세요?

 

CSS에서 

html[lang=en] .클래스 { CSS 속성 };

 

이렇게 쓰면 '언어값=영어 일때' 클래스 css값을 정해주는데

 

이 구문을 '언어값이 영어가 아닐때' 로 쓸 수 있는 방법도 있나요?

php에서는 느낌표? 같은 것을 사용해서 표현하던데.. 비슷한 방법이 있나해서요

스코스코 Lv. 5

댓글 12

  • 2022.01.19 23:07 #1646078
    html:not([lang=en])
  • 2022.01.19 23:12 #1646082
    빠른 답변감사합니다! 잘되네요!
  • 2022.01.20 00:10 #1646091

    위와 같이 할 수는 있는데, 선택자에 저런 "로직"이 많이 들어갈수록 속도는 나빠진다고 합니다. 너무 많이 쓰지는 마세요~^^

  • 2022.01.20 01:13 #1646107
    헉 감사합니다. 최소한으로만 써야겠습니다.
  • 2022.01.20 01:35 #1646112

    그냥 클라스들어가서 사용하시면 큰 문제 없을겁니다.

  • 2022.01.20 02:06 #1646119
    그냥 클라스 들어가서 →→ css 화일에서 위와 같이 사용하면 된다는 말이시죠?
  • 2022.01.20 02:56 #1646127

    .클래스 { 영어가아닐때 속성 }
    html[lang=en] .클래스 { 영어일때 속성 }

    이런식으로 하시면 된다는 의미 같습니다. 영어일땐 두 속성이 모두 적용되므로 나중에 선언된 영어일때 속성이 우선 적용되며 이외는 영어가 아닐때 속성만 적용되죠

  • 2022.01.20 03:10 #1646136
    아하! 감사합니다!
  • 2022.01.20 04:38 #1646152

    https://www.w3schools.com/cssref/tryit.asp?filename=trycss_sel_lang
    이런 형식으로 해서 특정 클라스에서 이게 어느 언어일때는 따지게 된다면 큰 무리는 없을거 같습니다.

  • 2022.01.20 05:41 #1646196
    예시까지 감사합니다!
  • 2022.01.20 05:05 #1646165

    not 구문을 사용하면 관리 및 이해에 노력이 더 필요하게 되므로 사용하지 않는 것이 좋습니다.
    css 의 기본개념인 상속(cascading)을 사용하려면,
    lang 옵션이 없는 기본 스타일링을 정하고, 언어별로 lang 옵션과 함께 추가 정의해서 구현해 보세요.

    요즘 backend를 사용하지 않고, 이렇게 frontend 기술으로만 사용해서 구현하는 다국어사이트가 유행이더라구요.

  • 2022.01.20 05:41 #1646200
    네~ 햇갈렸지만 생각해보니 not 조건 없이 구현 가능하겠네요. 저녁에 해보려구요! 감사합니다!