본문 바로가기
728x90

홈페이지 만들기16

iframe이 안보일 때 https iframe http 웹사이트에서는 iframe은 활성화가 됩니다. 하지만, https는 웹 보안상 iframe이 활성화가 되지 않습니다. 이럴 때 아래의 내용을 참고하시면 https에서도 iframe을 사용가능하게 사용할 수 있습니다. 1. 아래 내용을 복사해 redirect.php 파일을 생성해주세요 ! 2. 생성된 파일을 index파일이 있는 곳에 복사해주세요. 3. 아래의 내용을 복사해 출력하고 싶은 본문에 붙여넣어 주세요. 2021. 5. 6.
iframe 불러오기 (아이프레임) iframe(아이프레임) 불러오기 예) 속성 src iframe에 삽입될 문서의 주소 width iframe의 너비 지정 (px, % 가능) height 높이 지정(px, % 가능) frameborder 테두리를 표시할지 말지를 지정 1(테두리가 있음) 0(테두리 지우기) scrolling 스크롤바 유무를 선택 yes(스크롤바 표시), no(스크롤바 없앰), auto (자동) longdesc iframe에 담길 내용을 설명하는 페이지. marginheight 내용의 top(위) bottom(아래) margin. marginwidth 내용의 left(좌) right(우) margin. align iframe을 정렬 top( 맨 위에 정렬) middle(중앙 정렬) bottom(아래에 정렬) left(왼쪽 .. 2021. 5. 6.
자바스크립트 기초배우기 변수 1. 자바스크립트에서 변수를 선언할때는, 변하지 않는 값은 const, 변할 수 있는 값은 let으로 선언하자. Tip. 작업할 때 우선 const로 사용하고 변경되어야 할 것들에 대해서는 나중에 let으로 변경해주자. 변수는 1. 문자와 숫자, $와 _만 사용가능 예) const My_NAME ="..."; let _=1; let $=3; 2. 첫 글자는 숫자가 될 수 없다. 예) let 1st ='A'; 3. 예약어는 사용할 수 없다. ex) let let = 10; 4. 가급적 상수는 대문자로 ex) const MAX_SIZE = 100; 5. 변수명은 읽기 쉽고 이해할 수 있게 선언하자 ex) let a=2; ( X ) 나쁜예 let usrNunber =2; ( O ) 좋은예 2021. 5. 3.
반응형으로 바꿀때 주의할 점들 height:100vh height:auto 보호되어 있는 글 입니다. 2021. 4. 29.
include 외부 문서 불러오기 외부문서 불러오기 2021. 4. 28.
Html,js,css 효과 플러그인 swiper Html,js,css 효과 플러그인 swiper 반응형 웹페이지를 만들기 위한 플러그인 사이트입니다. 해당 사이트를 통해 플러그인 소스를 다운받고 소스코딩을 하면 손쉽게 반응형 웹페이지를 구현하실 수 있습니다. 1. 데모페이지 swiperjs.com/demos Swiper Demos Swiper is the most modern free mobile touch slider with hardware accelerated transitions and amazing native behavior. swiperjs.com 플러그인 데모를 미리 보고 해당 소스를 다운 받거나 복사하여 사용할 수 있습니다. 2. swiper 다운받기 github.com/nolimits4web/swiper/releases?after=v.. 2021. 4. 27.
css 스타일 시트 글자를 더 우아하게 만드는 방법 소스를 복사하여 css 스타일시트에 붙여넣어 사용하세요. body { font-family: 'Tangerine', serif; font-size: 48px; text-shadow: 4px 4px 4px #aaa; } 2021. 4. 27.
구글 폰트 사용방법 1-1. 소스를 head 사이에 복사해서 붙여넣어주세요. 예) 1-2. 소스를 body에 붙여넣어 주세요. Your text Your text 예) Your text 2.소스를 css 스타일 시트에 붙여넣어 주세요. .css-selector{ font-family:'선택한 폰트 이름', serif; } .css-selector이 부분은 해당(선택할) class의 이름을 입력해줍니다. 전체 적용 예 1) Your text 전체 적용 예2) Your text 2021. 4. 27.
material-design-icons 사용방법 사용방법 1. 사용법은 기본적으로 아래 1번을 하고 원하는 머티얼리 아이콘을 body에 붙여 넣어주면 사용이 됩니다. 1-1. 소스를 html 문서의 head 사이에 링크를 복사해서 붙여넣어줍니다. 예) 1-2. 원하는 아이콘을 검색후에 소스를 body의 원하는 부분에 붙여 넣어줍니다. 햄버거 소스 menu 예) menu 전체 적용 예) menu 2. 셀프 호스팅 방법 2-1. 웹 글꼴을 자체 호스트하려는 사용자의 경우, 몇 가지 추가 설정이 필요하다. 예를 들어 아이콘 글꼴을 위치에 호스트 경로(https://example.com/material-icons.woff)및 다음 CSS 규칙을 추가하십시오. 소스를 css 스타일 시트에 넣어 사용합니다. @font-face { font-family: 'Mat.. 2021. 4. 27.
728x90