미디어 쿼리로 내 홈페이지 만 타겟팅 할 수 있습니까?

미디어 쿼리를 사용할 수는 있지만 내 홈페이지에만 영향을 미칠 수 있습니까?미디어 쿼리로 내 홈페이지 만 타겟팅 할 수 있습니까?

휴대 기기에서 볼 때 woo-commerce 상점을 설정하는 중이며 모든 사이트가 홈페이지와 별개로 보입니다. 나는 성공하지 못한 날을위한 해결책을 찾고있었습니다.

그렇다면 어떤 코드로 시작하는지 알려주세요. 도움이된다면 큰 도움이됩니다. Paula

2017-09-24 paula s

당신은 집에 CSS를 대상으로 미디어 쿼리 및 방법을 모두 사용합니다

body.home .any-css-selector { styles }

당신은 아마 CSS 파일이 있습니다.

@media only screen and (max-width: 600px) { 

    .home .my-selector { 
     font-size: 14px; 
    } 

}

WordPres 테마는 일반적으로 페이지 ID에 대한 body 클래스를 추가하거나 :

즉, 당신은 신체 클래스가 필요

, 당신이 목표하고자하는 화면의 크기에 대한 미디어 쿼리 내에서 같은 home, 페이지의 슬러그, 즉 home 또는 front-page. <body> 태그 안의 페이지 소스를 확인하십시오.

그것은 귀하의 사이트에로드되는 방법 다음 작업을 실시간으로 CSS와 HTML을 변경하고, 무엇을보고 Firefox (또는 Firebug) 또는 Chrome 또는 Safari 또는 IE에서 개발자 도구를 사용하는 방법을 학습하는 것이 가장 좋습니다 테마의 style.css에 변경 사항을 추가 할 수 있어야합니다.

출처

2017-09-24 22:58:20 markratledge

확실히. 제 생각 엔 WordPress의 경우 body 태그에 home 태그가 있다고 생각합니다. 따라서 클래스 정의 내에서 클래스가 어디에 있는지, 미디어 쿼리 내부에 있는지 여부는 중요하지 않습니다.

이

bla {} 
blabla {} 
@mediaquery mobile { 
    body.home .class { styles } 
    body.home .another-class { more styles } 
    bla {} 
    blabla {} 
}

출처

2017-09-24 22:37:49 jack

감사합니다 잭, 그래서 내가 PHP 파일이나 CSS에서 편집합니까? –

그것은 CSS 코드입니다. 나는 당신이 모바일에 사용되는 미디어 쿼리 안에 넣어야한다고 생각합니다. – jack

문제가 해결되면 대답과 upvote를 수락하는 것을 잊지 마십시오. – jack

미디어 쿼리로 내 홈페이지 만 타겟팅 할 수 있습니까?

답변

관련 문제