1단계) 쌩초보 코딩 HTML,CSS(14)
-
2023.11.24 [css이용한 반응형 웹페이지2]
media쿼리 : 순서대로 적용됨 (아래에서 위로) media 쿼리는 같은 범위일때 @ = input (먼저 입력한 순으로 (예로들자면, @media는 고유한 특수성을 띄는데, a4용지 빨간색 를 맨 처음에 깔고, 그 위에 a5용지검은색을 깐다. 그럼 딱 봤을때, 사이즈가 큰 빨간색 a4용지가 뒤에있고, 그 앞에 a5 작은 검은색종이가 위치해 있어서 컴퓨터는 두개의 색상을 인식하고 또 두번째 마지막에 깐 a5 검은색 종이 먼저 인식을 한다. 그러나, 맨 처음에 a5 검은색 종이를 깔고, 그 앞에 a4 하얀색 종이를 깔면, 컴퓨터는 그 처음에 깐 종이색상을 인식 못하기 때문에, 앞에있는 a4 하얀색 종이색상을 인식한다. 마찬가지로 두번째 마지막에 깐 a4 하얀색 종이색상을 먼저 인식한다. 그래서 홈페이지 ..
2023.11.24 -
2023.11.23 [css 를 활용한 반응형 웹페이지 ]
복습 h2가 광범위하게 쓰기 때문에, 보통 이것도 광범위하다. 그래서 class를 자주 사용한다. class 안에있는 h2를 자세하게 효과를 주고싶으면 .m-box h2 {___} 쓰면된다. class 를 이용하면 동일한 디자인을 다른 내용에도 붙여줄 수 있다. span 태그는 스페이스 바 기능을 대체하는 것 같다. 그리고 css 이용해서 꾸며주는 역할이 있다. 영역 파란색 auto 영역 -> inline h1 은 화면을 좁히면 자기 공간 안에서 자유롭게 자동 조절됨, span은 화면을 좁히면 서로 겹침 padding은 글자크기 이상의 공간에 색을 입힐 수 있을 사이즈를 조정하는 기능이다. border-radius 모서리 부드럽게 원의 반경을 의미함, (같은색 테두리 선 굵기) text-decoratio..
2023.11.23 -
2023.11.22 [css시작2]
-복습- - css파일을 활용하려면 html 파일이 꼭 있어야한다. head에 먼저 link를 써서 들여와야함 ____ - --- ? head 내용에 먼저 선행되어야 함 - html은 글자와 디자인을 동시에 보면서 작성해야함. 동시에 두 작업파일을 분할나눔할 수 있다 . -css 독특한 특징 : css는 선택자와 , 디자인 { 가 들어있다., @ < 외부에서 디자인을 가져왔다는 의미, 폰트를 적용하려면, 가져오기만하면 안되고 꼭 Font family: '_________' 가 있어야한다. 전체글꼴 바꾸고싶으면, 전체를 의미하는 * 를 사용. * { background-color: dargnevy; } color 에는 색상클릭,색상이름,색상따오기(어도비컬러) 넣을 수 있다. font-size: __px; ..
2023.11.22 -
2023.11.21 [css 시작1]
CSS 시작 (body 영역) 118p style : 글자에 원하는 컬러값을 넣어준다. CSS란 HTML을 꾸며준다. 결과 p { color:rgb(136, 0, 255) } 이부분이 CSS 이다. 추가로 다른 글자로 색 입히고 싶으면 CSS란 HTML을 꾸며준다. css 적용 h1 을 추가한다. * CSS 주석은 /**/ 를 사용한다. ex) /*style 태그 안에서 css사용*/ /*주석모양이 html과 다름*/ background 사용 : 글자 배경화면 결과 p { color:rgb; background-color : aqua; } 끝에 꼭 ; 붙어있다. MMDN wsb docs CSS: CSS(Cascading Style Sheets) | 증권 시세 표시기 (mozilla.org) CSS: Ca..
2023.11.21 -
2023.11.20 [상자박스 및 메뉴판 만들기2]
-어제 내용 복습 HTML meta = 다른 인터넷에 나와있는 내용을 보여주는거 apan 태그 이용해서 문장 일부를 꾸며줄 수 있다 form action : submit 을 누를 때 실행되는 기능 infot은 글자를 사용할 수 없어 label과 같이 사용함 이름 label for와 id="name" 이 연결됨 label check 사용시 서버로 연결할때 쓰는 name이기 때문에 비워둠 button - submin,resat 은 form 안에서 꼭 사용 input 은 type 따라 모양이 바뀐다. -챕터 6가지 배우기. -블로그에 배운 내용 정리 내일부터 디자인 예정 질문햇더니 일단 자바스크립트 먼저 해보기. 웹카카오 토스 등은 알고리즘 gsat 위주 공부 궁금증 link 와 a 차이는 무엇인가? 혹은 l..
2023.11.20 -
3. 2023.11.17 [상자 박스 및 메뉴판 만들기1]
-복습- html 수업복습 어제배웠던 html을 활용합니다. 어제배운 파일 form (body 영역, 속성이 있어서 자동완성으로 쓰는게 효율적) -lavel 이름" 위에있는 infut 태그와 연결 라벨이 id값 찾을수있게 -infut : 가 없다. 반드시 , 로그인할때,설문조사,게시글 작성시 주로 활용 특수한 태그 사용자가 데이터를 입력하는 영역을 결정 -action 버튼 눌렀을때 넘어가는 다른 홈페이지(html) 이름" 카카오톡의 경우 submit 이 로그인 input이 아이디적기란 >구글의 경우 검색란을 input으로 활용 >네이버 블로그 댓글쓰기가 input을 활용 등록은 submit을 활용 list 경우 >네이버에서 쇼핑 원플원 쇼핑라이브 등 이런건 이름에 오른쪽마우스 클릭->검사 클릭->링크 분..
2023.11.17