728x90 반응형 ☭DEVELOPER/#2 웹개발(자바기반 풀스택)214 비주얼 스튜디오 코드⑧ 영역의 레이어를 바꿔주는 명령어 margin: 50px auto; 위쪽에서 50픽셀 띄워주고 auto는 좌우 자동으로 맞춰줌 01 float float: 띄워서 오른쪽이나 왼쪽으로 위치시킴 float을 하게 되면 2층으로 보내지기 때문에 가상요소로 넣어줌으로써 테두리선이 위로오게됨 가상요소 명령어 #wrap::after{ content:""; display: block; clear:both; } 반응형으로 인해 부모에 기준점을 잡아서 위치를 시켜줘야함 기준점은 부모자리에 position: realative; 으로 잡아준다. 임의지점은 자식자리에 position: absolute; 0,0의 자리를 먼저 알아두면 객체 위치시킬 때 편리하다. 02 영역의 레이어 층을 바꿔주는 명령어 z-index : 레이어 층을 바꿔준다. position:.. 2023. 5. 24. 비주얼 스튜디오 코드⑦ border 사용법 div:nth-child(1) - div 의 첫번째 div를 뜻함 = div:first-child - first도 사용가능 div:nth-child(2) - div 의 두번째 div를 뜻함 div:nth-child(3) - div 의 세번째 div를 뜻함 = div:last-child - 마지막 div를 뜻함 01 border border style : 한번에 지정 가능함 border: 10px dashed #000 / 보더크기 스타일 색 02 블럭구조와 인라인 구조 블럭요소 태그는 자동줄바꿈됨 p태그: 블럭구조 다음줄로 내려가게됨 , 한 단락씩 표시됨 span태그 : strong태그: 글자 굵게 em태그: 비스듬한 글자 span, strong, em: 인라인 구조라서 옆으로 이어지게 됨, 한 줄에 들어.. 2023. 5. 23. [포토샵]컨텐츠만들기 새문서 만들기 가이드라인 설정해주기 이미지넣어주기 사각형 선택 fill-투명 , stroke- white, 15px width 600px X height 400px 사각형 생성 밑에 부분 사각형 선택툴로 선택 후 지워주기 중간에 흰색 원 그려주기 원 크기 143 x 143 원 생성 모양 툴에서 고양이 발바닥 생성해주기 ctrl+j로 레이어 복사해서 발바닥 두개 만들어주기 글씨도 넣어줘서 로고 만들어 주기 2023. 5. 23. [포토샵]블로그 메인화면만들기 가이드선으로 레이아웃만들기 해수욕장이미지 열기 > 이동툴로 새문서에 옮겨주기 이미지 크기조정해서 문서에 맞춰주기 혼합모드: 두개의 사진을 자연스럽게 합성해 주는 모드 드롭섀도우-빛이 글자의 뒤에서 나오는 것처럼 표현할 수 있다. 원 ctrl+j 해서 레이어를 복사해주기 복사한 원 숨겨주고 원 아래 레이어 선택하여 레이어마스크 적용해준다. 붓을 선택하여 지구별여행자와 원에 겹쳐져있는 부분을 지워준다. 이클립스 copy1레이어 레이어 마스크 씌워주기 fill-white / stroke-투명 으로 설정해서 원 흰색으로 채워주기 전경색 검정색/ 밑에서 아래로 그라디언트 적용 그라디언트가 적용된 원을 볼 수 있다. 빛레이어 만들어주고 붓을 선택하여 원 윗부분에 찍어준다. 빛레이어 선택 후 ctrl+t 누른 후 오.. 2023. 5. 23. [포토샵]섬네일 만들기 새로만들기: 포토샵 > new 사진 불러와서 이동툴로 새문서에 넣어주기 ctrl+t 로 적당한 크기 조절 컬러조정해주기 : alt+delete로 전체색 덮어주기 레이어마스크선택 후 그라디언트(흰-검)설정 그라데이션으로 색 넣어주기 글씨 넣어주기 글씨 효과 넣어주기: 그림자(drop shadow) 섬네일 완성 2023. 5. 23. 비주얼스튜디오코드⑥ 주문서 작성하기 thead tfoot tbody tbody가 추가 될 수 도 있기 때문에 나중에 넣는 편임 class> style 적용할 때는 . 으로 시작 .table2 명령어를 중복되어 쓸때는 ,(쉼표)를 써주고 같이 적용할 부분을 써주면 된다. *주문서 작성하기 랩 wrap: 웹페이지를 감싸는 역할을 함 큰덩어리이이기 때문에 id를 부여해준다. *{} : 전체적용 margin: 0; : 상단 여백 없애줌 여백없이 랩 적용 h태그: h1- 로고 적용 시 사용 h1은 로고에 사용하지만 로고가 없으니 h1 사용 p태그: 단락 태그 줄 칸 띄우기 padding: 안쪽 여백/ 칸 포함해서 적용됨, 박스 넓이 높이가 같이 늘어남 margin: 칸 제외됨, 칸이 안늘어남 **wrap: height 높이값 적용 안 하는게 좋음,.. 2023. 5. 22. 이전 1 ··· 31 32 33 34 35 36 다음 728x90
