코딩을 한단계씩 부셔보자.

코딩을 한단계씩 부셔보자.

  • 분류 전체보기 (319)
    • 코딩배움일지 (157)
      • JAVA (79)
      • DataBase (29)
      • Web 구현 (34)
      • 인터페이스 구현 (15)
    • 개인적인 공부 (142)
      • 자바 (6)
      • 백준 (47)
      • Java의 정석 (0)
      • 그냥정리 (2)
      • Database 복습 (5)
      • 테스트 페이지 (1)
      • 프론트엔드 (7)
      • Unity (29)
      • Python (45)
    • TeamProjectHappy (12)
      • front (9)
      • database (3)
    • 개발일지 (2)
      • Journey to West (2)
  • 홈
  • 배움기록
  • 태그
  • 방명록
RSS 피드
로그인
로그아웃 글쓰기 관리

코딩을 한단계씩 부셔보자.

컨텐츠 검색

태그

c# 백준 Python 배열 자바기초 javascript unity html 파이썬 CSS 자바 javabasic 왕초보 java 유니티 SQL java기초 database 2D Web

최근글

댓글

공지사항

아카이브

CSS(17)

  • Web 5일차 (선생님과 함께하는 Oven clone page)

    태그만 써버리면 나중에 필요할때 못 줄 수 도 있다. class 를 우선 주도록 한다.?? 목록은 ul로 잡자 caret 을 font Awsome 에서 다운을 받았다. span을 안해도 적용이 된다. i 는 이텔릭체 1 교시 html OvenBETA 양진구 Css *{ box-sizing: border-box; font-size: 14px; } body{ margin: 0; } .container{ margin: 0px auto; padding: 0px 15px; width: 1170px; } .navbar{ display: flex; justify-content: space-between; /* 중앙을 비운다.*/ align-items: center; /*가운데 정렬*/ width: 100%; }

    2022.12.26
  • Web 클론 페이지 (선생님 과제 Kakao Oven)

    선생님이 카카오 오븐 클론 페이지를 만들라고 했다. 개 빡세다. 날 죽여라. 내꺼. 난 여기까지 빡세다 글자폰트 다름. 글리피콘 내맘대로 잘안됨 하... 취업할 수 있을까? Java 수업이나 DataBase는 팀원들 덕분에 할 수 있었는데 웹 페이지는 .... 머리가..

    2022.12.25
  • Web 4일차 4(반응형 웹)

    반응형 웹 디자인 웹 사이트의 내용을 그대로 유지하면서 다양한 화면 크기에 맞게 웹 사이트를 표시하는 방법 다양한 화면 크기의 모바일 기기들이 계속 쏟아져 나오는데 그 때마다 그 크기에 맞춘 사이트를 별도로 제작하는 것은 비효율적 🡪 화면 크기에 ‘반응’해 화면 요소들을 자동으로 바꾸어 사이트를 구현하는 것이 바로 반응형 웹 디자인 모바일 기기를 위한 뷰포트(viewport) 뷰포트 : 실제 내용이 표시되는 영역 PC 화면과 모바일 화면의 픽셀 표시 방법이 다르기 때문에 모바일 화면에서 의도한대로 표시되지 않음 🡪 뷰포트를 지정하면 기기 화면에 맞춰 확대/축소해서 내용 표시 그리드 레이아웃이란 반응형 웹 디자인에서 웹 문서 요소를 배치하는 기준 웹 사이트 화면을 여러 개의 칼럼(column)으로 나눈 후..

    2022.12.23
  • Web 4일차 3(background)

    background-color 속성 웹 문서의 요소에 배경색 지정 16진수나 rgb 값, rgba 값 또는 색상 이름 사용 배경색은 상속되지 않는다 background-clip 속성 배경을 어디까지 적용할지 지정 ( padding 까지 먹힌다.) 클립까지 히든 잡고 패딩 솔리드 보더박스 background-image 속성 배경 이미지 파일 경로 지정 background-repeat 속성 배경 이미지 반복 여부 및 반복 방향 지정 repeat 은 기본값 background-position 속성 배경 이미지를 반복하지 않을 경우, 배경 이미지를 표시할 위치 지정 ① 백분율 : 배경 이미지의 가로 위치와 세로 위치를 %로 나타냄. 예) background-postion: 0% 0% , background-po..

    2022.12.23
  • Web 4일차 2(position, border-radius)

    2교시 시작 box container2 는 box container1에 영향을 받는다. .box-container2{ /* position: relative; */ top: 100px; left: 100px; border: 1px solid black; width: 300px; height: 300px; } 포지션을 지운다면 relative 가 없다면 body 까지 올라간다. 가운데 상자가 바깥상자가 커지던 작아지던 가운데 정렬 하시오 선생님 border-radius image 프로필 .profile-img-box{ display: flex; justify-content: center; align-items: center; border: 5px solid #dbdbdb99; border-radius: 5..

    2022.12.23
  • Web 4일차 1(display)

    display 속성 요소의 배치 방법 결정. 웹 개발 시작하기 웹 개발 시작하기 블록 레벨 요소, 인라인 레벨 요소를 바꿀 때 사용하는 속성 값 float 속성 요소를 왼쪽이나 오른쪽에 떠 있게 만듦 left, right, bottom, top 속성 웹 요소의 위치를 지정하는 속성 position 속성 웹 문서 안에 요소들을 배치하기 위한 속성 .box1{ left: 100px; border: 1px solid black; width: 300px; height: 100px; background-color: brown; } 이렇게 하면 백날 해도 수정 안됨 .box1{ position: relative; left: 100px; border: 1px solid black; width: 300px; heigh..

    2022.12.23
이전
1 2 3
다음
티스토리
© 2018 TISTORY. All rights reserved.

티스토리툴바