cording 썸네일형 리스트형 [Java Script] HTML 과 JS 태그, 이벤트 Java Script : 객체 지향 프로그래밍 언어 운영체제에 독립적임. JavaScript html 1+1 JavaScript html 1+1 * 자바의 값은 2 , html은 그대로 1+1이다. 여기서 자바스크립트가 더 유연하다는 것을 알수있다. *onclick 속성의 속성값 alert('hi')은 반드시 자바스크립트 이어야 한다. >>웹브라우저가 속성값을 기억하고 있다가 onclick 속성이 위치하고 있는 태그에 사용자가 클릭했을때, 기억하고 있던 자바스크립트 코드를 자바스크립트의 문법에 따라 해석해 웹브로우저가 동작한다. * input type="button" : 버튼생성 input type="text" : 텍스트 입력칸 생성 ** onclick, onchange, onkeydown : event.. 더보기 [CSS] 코드의 간결화 SEVENTEEN HIPHAP TEAM VOCAL TEAM PERPOMONCE TEAM HIPHAP TEAM * 각 페이지에 태그 내용을 붙여놓기 하면 똑같이 적용된다. 그러나 불편하기 때문에 태그의 내용을 하나의 페이지로 만들어 적용시키기로한다. *href="페이지이름" 왜? 간결화를 해야하는가 꼭 기억하자. 더보기 [CSS] 미디어 쿼리 적용해보기 사용자의 환경에 따라 웹페이지 디자인이 변경되는 것 (웹에서 앱으로 볼 때 등) Responsive Responsive *screen width > 800px : 스크린의 크기가 800픽셀보다 클 때 (이해차원으로 쓴 내용) 를 조건으로 설정하고 싶다면 위와 같이 설정해주면 된다. 반대로 screen width 더보기 [CSS] Grid 그리드 활용하기 NAVIGATION ARTICLE NAVIGATION ARTICLE > NAVIGATION ARTICLE * 태그는 제목이라는 의미를 가지고 있기 때문에 의미가 없고 디자인만 하는 용도 태그로 바꾼다. ** : inline element // : block-level element NAVIGATION ARTICLE : div를 부모태그로 사용가능 NAVIGATION ARTICLE *grid : 두방향(시작점에서 가로세로) 레이아웃 시스템 grid-template-columns(열) : 그리드의 형태를 정의함 (그리드의 열의 배치)grid-template-rows(행) : 그리드의 행의 배치 1fr(fraction) : 그리드 컨테이너 내의 공간 비율을 나타냄 유용한 웹사이트 https://caniuse... 더보기 [CSS] 박스 모델 그리고 응용하기 CSSCascading Style Sheets(CSS)는 HTML이나 XML(XML의 방언인 SVG, XHTML 포함)로 작성된 문서의 표시 방법을 기술하기 위한 스타일 시트 언어입니다. CSS는 요소가 화면, 종이, 음성이나 다른 매체 상에 어떻게 렌더링되어야 하는지 지정합니다. CSS CSS *padding : 테두리 안쪽 여백 설정 margin : 박스 바깥쪽 여백 설정 SEVENTEEN HIPHAP TEAM VOCAL TEAM PERPOMONCE TEAM 더보기 [CSS] 선택자의 기본 SEVENTEEN HIPHAP TEAM VOCAL TEAM PERPOMONCE TEAM HIPHAP TEAM S.COUPS 세븐틴 총괄리더이자 힙합팀 리더2020년에 문명특급을 보다가 아이같이 환하게 웃는 모습을 보고서 덕통사고를 당해 현재까지도 최애가 되버린 나의 그이. HIPHAP TEAM VOCAL TEAM PERPOMONCE TEAM 원하는 TEXT에 일일히 pink로 바꾸어줌 but 일일히 해야하는 번거로움이 있음 이것을 선택자를 활용해 바꾼다. SEVENTEEN HIPHAP TEAM VOCAL TEAM PERPOMONCE TEAM SEVENTEEN HIPHAP TEAM VOCAL TEAM PERPOMONCE TEAM class 값이 saw인 모든 태그에 대해 폰트를 pink로 설정했다. 그리고.. 더보기 [CSS] 기본문법과 속성 알아내기 CSS (Cascading Style Sheets) WEB 1. WEB *font : 정보는x 오로지 디자인적 요소 text-decoration:underline : 텍스트 밑줄 스타일 속성을 이용해 바꾸려는 부분에만 적용시켰다. 2. * a{} : seleator 선택자 color: red; : declaration 효과 효과는 또 두가지로 분류할수 있다. color : property 속성red : value 값 WEB WEB ** search tip : css text size property, css text center property 더보기 [HTML] 생활코딩 정리 1 지금까지는 너무 재밌는데 자바 들어가면 힘들어하겠지...? 비전공자로서 더 열심히 기록하고 기억해야지. HTML = Hypertext Make up Language 으로 웹구동언어이다. Atom은 Html Editor 으로 생활코딩 수업을 들으며 사용했다. SEVENTEEN SEVENTEEN 세븐틴 : 관용적 : 본문의 모든 태그 : 본문을 묶는 태그 SEVENTEEN **걸고싶은 text SEVENTEEN 세븐틴 : 이미지삽입 src(리소스)="파일명"width="450"(이미지크기) text : 글씨 두껍게 *text : underline 밑줄 ! 의미가 없다면 CSS 의 text-decoration을 사용 속성 underline으로 바꾸어 쓰는게 더욱 적절하다. text ... text : 제목1(.. 더보기 이전 1 2 3 4 다음
