Share
Sign In
2. [모바일] 메인 대배너
🔵 파일명 : mainSwiper.html
👉🏻 코드
HTML 설명
- line 1~7 ) 첫번째 슬라이드 태그
- line 8~14 ) 두번째째 슬라이드 태그
- line 1, 8) OnClick 이벤트 클릭시 링크로 사이트 연결, 이미지 삽입 코드
- line 2, 9) 첫번째 대배너 메인 텍스트 <br>을 추가하면 세로정렬, <br>을 빼면 가로정렬
- line 3, 10) 두번째 대배너 서브 텍스트 <br>을 추가하면 세로정렬, <br>을 빼면 가로정렬
- line 5, 12) 더 알아보기 버튼의 링크 설정
- line 1~7 ) 첫번째 슬라이드 태그
- line 8~14 ) 두번째째 슬라이드 태그
- line 1, 8) OnClick 이벤트 클릭시 링크로 사이트 연결, 이미지 삽입 코드
- line 2, 9) 첫번째 대배너 메인 텍스트 <br>을 추가하면 세로정렬, <br>을 빼면 가로정렬
- line 3, 10) 두번째 대배너 서브 텍스트 <br>을 추가하면 세로정렬, <br>을 빼면 가로정렬
- line 5, 12) 더 알아보기 버튼의 링크 설정
👉🏻 이미지 수정
📌 FTP로 이미지 업로드를 하신후 이미지링크을 복사 하신후 line 1번 코드수정
📌 style="background:url('/web/2024_main/pc.jpg')
📌 이부분에 url 뒷부분을 이미지링크로 수정
📌 style="background:url('/web/2024_main/pc.jpg')
📌 이부분에 url 뒷부분을 이미지링크로 수정
👉🏻 텍스트 수정
📌 메인 텍스트 line 2,9번 서브 텍스트 line 3, 10번 코드수정
📌 <div class="item-text1">광주요가 제안하는 한국의 멋</div><br>
📌 이부분에 원하는 텍스트로 변경
📌 <div class="item-text1">광주요가 제안하는 한국의 멋</div><br>
📌 이부분에 원하는 텍스트로 변경
👉🏻 링크 수정
📌 이미지 전체 부분 링크 수정 line 1,8 번에 Onclick 뒤에 작은따옴표 안에 링크 수정
OnClick="location.href='https://www.ekwangjuyo.com/article/%ED~~%98/13/23798/'"
📌 더 알아보기 링크 수정 line 5, 12번에 href 뒤에 큰따옴표 안에 링크 수정
<a href="https://www.ekwangjuyo.com/article/%ED~~~%85%98/13/23798/"
OnClick="location.href='https://www.ekwangjuyo.com/article/%ED~~%98/13/23798/'"
📌 더 알아보기 링크 수정 line 5, 12번에 href 뒤에 큰따옴표 안에 링크 수정
<a href="https://www.ekwangjuyo.com/article/%ED~~~%85%98/13/23798/"
👉🏻 글자색 변경
📌 line 2,3,4) 아래 코드처럼 div class 부분을 1,2,3 (white)→ 4,5,6 (gray) 으로 변경해주시면 됩니다
📌 line 5) 버튼도 class 부분을 "rounded-button" (white) → "rounded-button2" (gray)로 변경해주시면 됩니다
📌 line 5) 버튼도 class 부분을 "rounded-button" (white) → "rounded-button2" (gray)로 변경해주시면 됩니다