>

내 버튼의 색상이 바뀌면 다음을 참조하십시오 :

button {
  background-color: orange;
}
button:hover {
  background-color: darkorange;
}

예 : https://jsfiddle.net/oepb5ks4/

데스크톱에서 잘 작동하지만 : 호버가 없어야하는 모바일에서 – 브라우저 *는 여전히 색상을 변경하지만버튼을 터치 한 후에

<올>
  • 왜 그런 행동입니까? 뭔가 빠졌습니까? 모바일 브라우저에서 마우스를 가져 가면어떤의미가 있는가?
  • 이를위한 훌륭하고 깨끗한 솔루션이 있습니까 (바람직하게는 미디어 쿼리 나 JavaScript가없는 경우)?
  • * Chrome ( "장치 모드") 및 iOS Safari에서 테스트되었습니다.

    • 답변 # 1

      CSS에서는 @media 를 사용하여 모바일 장치를 필터링 할 수 있습니다.  규칙 및 필터 (w3의 문서). "미디어에 호버 기능이있는 경우 호버 색상이 주황색이어야합니다"라고 말할 수 있습니다.

      @media not all and (hover: none) {
          a:hover{
              color: orange
          }
      }
      
      

      또한 JS로 감지하고 모바일에서 항상 주황색이되도록 색상을 수동으로 조정할 수 있습니다.

      PC에서 버튼을 클릭하기 전에 이전에 마우스를 올려 놓아야했기 때문에 문제가 발생했다고 생각합니다. 클릭하면 모바일에서 색상이 변경됩니다.

      업데이트방금 Temani Afif의 질문에 따른 의견을 읽었습니다 : 분명히 :hover s는 :onclick 와 같은 것으로 "변환됩니다"  휴대 전화의 호버 기능이 없기 때문에 모바일에서 많은 웹 사이트가 호버 메뉴를 가지고 있으므로 모바일 사용자는 번역하지 않으면 액세스 할 수 없습니다.

      또 다른 방법은 방문한 링크의 색상을 다음과 같이 강제하는 것입니다.

      a:visited { 
        color: orange!important;
      }
      
      

      업데이트 2새 미디어 태그를 포함하고이 질문에서 다른 질문에 대한 조언을 얻었으며 사용하지 않는 방법 및 @media 규칙에 대한 의견입니다.

    관련 자료

  • 이전 angular를 사용하여 Java에서 파일 CSV를 수신하는 방법
  • 다음 split ()을 수행 한 후 사전을 반환하는 파이썬 목록 이해