728x90 반응형 프론트엔드19 직장인 코딩 용어 ④ 개발언어, 프레임워크 복습 > 프로그래밍 언어는? 인간과 가장 가까운 언어로, OS에 명령을 내리는 것 인터넷 세상에서 잘 듣고 있다가 요청이 오면 응답을 줘!! ➡️ 서버를 만드는 명령 그런데!! 이 프로그래밍 언어들로 서버를 처음부터 다 만든다는 것은 아주 어려운일이다.. 프레임 워크 미리 만들어놓은 블록세트이다. 언어마다 서버를 만들 수 있는 블록세트가 정해져 있다. 서버를 만들 때 프레임워크에서 필요한 기능을 갖다가 쓴다. 스프링 프레임워크에 대한 이해와 경험도도 중요하다. 파이썬은 데이터분석으로 이용됨 장고를 다룰 수 없으면 서버를 못 만든다. 웹 프론트엔드: 우리 눈에 보이는 부분 프론트엔드 언어 자바스크립트 기반의 프레임워크들이 나왔다. 프레임워크를 사용하면 용량을 조금 적게 보낼 수 있거나, 페이지의 깜빡거림이.. 2023. 7. 29. 비주얼 스튜디오 코드 69_파노라마 회사소개02 .face3 html 마크업 .face3 css 편집 .pic에서 공통된 속성을 적용해주고 nth-of-type으로 각각 사진만 넣어준다. Co Company Android Apple Twitter Facebook YouTube Google What's New New n Articles What is Lorem Ipsum? Lorem: 텍스트 자동 완성 기능 Lorem ipsum dolor sit amet consectetur adipisicing elit. Beatae, explicabo quia error perspiciatis eveniet deserunt assumenda corporis minima voluptas consequatur quibusdam consectetur quae numqua.. 2023. 7. 7. 비주얼 스튜디오 코드 64_ 하이시네마 웹페이지 03 swiper 접속 use swiper from CDN에 https:// 부터 복사 브라우저 새창 열고 복사한 주소를 붙여넣는다 전체선택 후 복사 swiper.css파일 새로 만들어서 복사한 것 붙여넣기 format Document 로 정렬 정리하기 java script도 가져오기 js 주소 복사하기 java script 파일 만들고 복사한 코드 붙여넣기 swiper.css 링크걸기 java script 링크걸기 swiper html 마크업 복사해서 .slider 안에 넣기 script swiper 복사해서 붙여넣기 닷메뉴 활성 clickable: ture, 글자 삭제 후 h3, p 태그에 문구 넣기 swiper demos 원하는 디자인을 선택 후 core를 클릭하면 코드가 나온다. script 부분 복사.. 2023. 7. 5. 비주얼 스튜디오 코드 62_ 하이시네마 웹사이트 만들기 02 html 마크업 css 편집 .container 편집 .header html 세부 마크업 .header css 편집 .nav html 세부 마크업 pc .nav css 편집 **로고와 네비를 꼭 float을 띄워야한다. 모바일 nav 만들기 햄버거 메뉴 만들기 반응형 화면 media css 만들기 ▼ .row 값을 화면 크기가 축소될 때마다 치수를 줄여준다. banner .nav 편집 media 편집 ◆ slick 슬릭을 2개 이상 사용시에 충돌이 나서 오류가 생긴다. 슬릭 여러개 사용시 슬릭 중 하나를 초기화 시키기 슬릭 초기화 코드 // $('.review').get(0).slick.setPosition() ◇ swiper https://swiperjs.com/ Swiper - The Most Mod.. 2023. 7. 4. 비주얼 스튜디오 코드 60_ parallax 06 스크롤 시 네비게이션 보이기 html 마크업 css reset css 편집 #nav nav position: absolute 띄워주기 nav를 숨겨놨다가 on을 만나면 나오게 되고 고정해줌 #contents @charset "utf-8"; *{ margin: 0; padding: 0; /* margin, padding 사이즈 반영이 안되서 높이, 너비값으로 직접 적용 */ box-sizing: border-box; color: #222; } li{ list-style: none; } a{ text-decoration: none; } .clearfix::before, .clearfix::after{ display: block; content: ""; clear: both; } #nav{ position: .. 2023. 7. 4. 비주얼 스튜디오 코드 43_웹 표준) 컨텐츠 컨텐츠 6개의 칸을 만들어서 바깥테두리 없이 레이아웃 진행 html 골격만들어주기 css 편집 표 위치와 영역 잡아주기 세번째 표의 보더를 없애주어야한다. .col3 오른쪽 위 끝 위치해야하기 때문에 보더, 패딩, 마진을 0으로 해주어야 올라간다. .col6도 똑같이 넣어준다. 각 표마다 아이콘 이미지 적용 img 에 아이콘 이미지를 적용했을 때 똑같은 이미지가 들어간다. .cont .colum .ico img > .cont .col1 .ico_img 부터 각각 이미지의 좌표를 지정해주면 다르게 이미지를 적용할 수 있다. 마우스 오버시 다른 이미지가 나오도록 한다. html 에서 각 col1 에 ir_pm을 적용하여 글씨를 없애준다. 다른 표에도 아이콘을 다르게 적용한다. .ico_tit 와 ico_de.. 2023. 6. 22. 이전 1 2 3 4 다음 728x90
