WINK-(Web & App) (433) 썸네일형 리스트형 [2023 신입부원 기초 스터디] 한승훈 #2주차 - CSS 기초 안녕하세요, 반갑습니다. 다들 한 주 잘 지내셨나요~? 사실 제가 글을 쓰는 시점은 중간고사가 종료된 후입니다. 하지만! 시간이 너무 빨리 지나가버린 여러분을 위해 제가 시험 10일 전으로 시간을 돌려드리겠습니다. 그리하여 4월 14일로 돌아왔네요. 제가 만들어드린 시간이니, 유익한 시간 되셨으면 좋겠습니다. 감사 인사까지는 안 하셔도 됩니다. 이번 블로그는 CSS에 대하여 다루어볼 건데요, 그래서 css는 무슨 뜻인가요? 많은 분들이 CSS란 무슨 내용인지 궁금해 하시는데요, 일교차가 크니 이웃 여러분 감기 걸리지 않게 조심하세요~ 1. CSS란 무엇인가? CSS (Cascading Style Sheets)는 웹페이지를 꾸미려고 작성하는 코드입니다. HTML와 같이 CSS는 실제로 프로그래밍 언어는 아.. [2023 신입부원 심화 스터디] 조현상 #2주차 - 기초문법 part.2, 3 심화스터디 2주차 글 시작~! #자바스크립트의 조건문과 반복문 그리고 함수 저번 시간 스터디 내용 - 변수 와 상수 선언 방법 - 변수 와 상수를 가지고 연산하는 방법 변수와 상수를 가지고 조건문을 만들 수 있다. 자바스크립트에서 제공하는 조건문은 if 와 switch 문이 있다. 먼저 if문부터 보면 const c = 30; if( c > 90) { console.log("A"); } else if( c > 50) { console.log("B"); } else{ console.log("F"); } //c는 30이기 때문에 F가 출력될 것이다. if 문은 if , else if , else 가 있다. if 문 선언은 if ( 조건문 ){ ...} 으로 선언할 수 있으며 조건문 안에 연산이 True 일 .. [2023 신입부원 기초 스터디] 박민규 #2주차 - CSS는 화려하게 (Like 음주 텐겐) CSS : Cascading Style Sheets CSS 형태 ↓ (선택자) h1 { color: blue; } ↑ ↑ (속성명)(속성값) Inline Style 하나의 태그 안에 style을 사용하는 방법 (절대 변하지 않을 스타일인 경우, 꼭 사용해야 할 경우에 드물게 사용) ex) ↑ style 속성을 여러개 주고 싶을 땐 이렇게 ' ; '을 사용한다. Internal Style 이러한 내부스타일 형식이며, h1대신 다른 태그에 class를 부여하고 .(class명) 후 속성명과 속성값을 부여할 수도 있다. 하지만 현업에서는 내부스타일 형식은 번거로운 작업이므로 잘 쓰이지 않는다. External Style 작업을 하고있는 html 파일이 아닌, 기존에 있는 CSS 스타일시트에 ↓ (선택자) h1.. [2023 신입부원 기초 스터디] 박승환 #2주차 - 새싹이 자랐다!! @@지난 강의에서는 HTML을 배웠다. 이번에는 CSS를 알아보자!@@ CSS(Cascading Style Sheets)란? HTML로 이루어진 문서를 꾸미 스타일 시트 CSS의 구조 선택자 - 꾸미고 싶은 HTML요소 (여기서는 h1) 속성명 - 꾸미고 싶은 속성명(여기서는 color) 속성값 - 어떻게 꾸밀지 입력(여기서는 blue) 인라스타일 VS 내부 스타일 VS 외부 스타일 인라인 스타일 HTML태그 안에다가 입력함. 내부 스타일 태그 안에다가 입력함. 외부 스타일 CSS 파일을 외부에 정의, 외부에 정의한 CSS를 HTML파일에 연결하여 사용 외부파일은 파일명.css로 해야함 태그로 외부와 연결. CSS 출처 우선순위 사용자 !important > 제작 !important > 제작자 > 사용자.. [2023 신입부원 심화 스터디] 황현진 #2주차 - 기초문법 part.2, 3 📌 조건문 if문 if(조건1){ 조건1이 참일 때 실행될 코드 } // 코드가 한 줄 일때는 중괄호를 생략해도 된다. else if(조건2){ 조건2가 참일 때 실행될 코드 } else{ 모든 조건이 거짓일 때 실행될 코드 } ⚠️주의할 점 : 하나의 조건문을 작성할 때 if, else는 한 번만 사용, if로 시작, else로 끝나야함(else는 없어도 된다.) switch문 (if문과의 차이점: 동일한 조건이 주어지고 그 조건의 값에 따라서 다른 코드를 실행하도록 함) switch(조건){ case 값: 실행할 코드 break; case 값: 실행할 코드 break; default: 위의 값 중 참이 되는 것이 없을 경우 실행되는 코드 } ⚠️주의할 점 : break를 써줘야한다. +) 예제코드 c.. [2023 신입부원 기초 스터디] 정찬우 #2주차 -CSS가 뭐길래... CSS란? HTML로 작성한 기본 틀을 꾸밀 때 사용하는 스타일을 정리한 시트. 정리하자면 HTML은 웹 페이지의 뼈대를 만들고, CSS로 웹 페이지를 예쁘게 꾸미는 역할을 함. CSS 구조 CSS 적용 방법 -인라인 스타일 - 스타일을 정의하고 싶은 HTML 요소에 스타일을 적용한다. -내부 스타일 - 태그 안에 태그를 사용하여 정의한다. -외부 스타일 -외부 스타일은 CSS 파일을 외부에 정의해 놓고, 외부에 정의한 CSS를 HTML파일에 연결하여 사용하는 것을 말한다. 관리하기 용이하고 용량도 적기 때문에 이 방법이 주로 사용됨 CSS 출처 3가지 -제작자 스타일 - 말 그대로 제작자가 작성한 스타일 -사용자 스타일 - 사이트를 사용하는 사용자가 구성한 스타일 -브라우저 스타일 - 브라우저마다 기.. [2023 신입부원 기초스터디] 도승준 #2주차 Cascading 뭔가 단어가 멋있지 않나요 저만 그래요? CSS란? -Cascading Style Sheet의 약자로 HTML을 꾸며주는 언어이다. Cascading 이라는 단어가 생소했는데 , 마침 강의에서 설명해주셨당 ㅋ -ㅋ (폭포라는 뜻) HTML은 1.제작자 스타일을 우선 적용하고, 2.그 다음 브라우저 사용자 스타일 3.브라우저 기본 스타일 순으로 적용하는데, 이처럼 폭포와 같이 스타일이 우선순위에 맞게 연속적으로 적용됨을 의미해서 Cascading이라는 단어를 사용하였다. -CSS 구조 -CSS 적용 방법 CSS의 적용방법에는 크게 세 가지가 있는데, 바로 1. 인라인 스타일 2. 내부 스타일 3. 외부 스타일이다 1. 인라인 스타일 태그 안에 CSS를 적용하는 스타일이고, ;를 써서 태그 안에 여러 가지 속성을 적용할 수 있다. 그렇지만 한 태그.. [2023 신입부원 기초 스터디] 조상혁 2주차 - CSS알아가기! Css 란? " CSS 는 사용자에게 문서를 표시하는 방법을 지정하는 언어 " Css의 구조 출처 : https://hack-cracker.tistory.com/30 Css적용방법 인라인 스타일 - Inline Style Sheet 내부 스타일 - Internal Style Sheet 외부 스타일 - External Style Sheet + Css 주석 : 주석은 Style Sheet 내에 메모를 남기는 것을 말한다. 사용법 - /* 메모내용 */ 메모내용란에 문자작성 Css 출처 ◆ 제작자 스타일 : 말 그대로 웹 사이트 제작자가 작성한 시트 ◆ 사용자 스타일 : 사이트를 방문하는 일반사용자들이 구성한 스타일 시트 예시) 윈도우의 "고대비"설정 + 보통은 잘 쓰이지 않으나 특수한 경우들이 쓰임 ◆ 브라.. 이전 1 ··· 48 49 50 51 52 53 54 55 다음
