티스토리

일단 하고보자

검색하기

블로그 홈

일단 하고보자

ccomrung-programming.tistory.com/m

컴퓨터공학 전공 공부 / 독학 기록

구독자: 1

방명록 방문하기

주요 글 목록

[CSS] MDN 과제: 학교 커뮤니티 홈페이지 만들기 ("Assessment wanted for Typesetting a community school homepage") Give the first paragraph after each heading in the a little bit of text-indentation, say 20px. section>p{ text-indent: 20px; } Make it so that external links have the external link icon inserted next to them. section p a{ background: url("external-link-52.png") no-repeat 100% 0; background-size: 1em; padding-right: 1.2em; } flex flex 컨테이너 : 전체 공간 설정 아이템 : 배치 형태에 관여 inline 요소처럼 내용물 만큼의 공간만 차지 컨테이.. 공감수 0 댓글수 0 2023. 3. 4.
[CSS] MDN CSS 정리3 기본적인 텍스트 및 글꼴 스타일링 글꼴 스타일링 색상 color : 요소의 내용 색상 설정 텍스트, text-decoration의 밑줄&오버라인 모든 CSS 색상 단위 사용 가능 p { color: red; } 글꼴 종류 font-family : 글꼴 지정 브라우저는 액세스하는 컴퓨터가 그 글꼴을 사용할 수 있을 경우에만 적용 그렇지 않을 경우 default font 사용 p { font-family: arial; } 웹 안전 글꼴 가장 많이 사용하는 운영체제의 대부분에서 사용 가능 이름 유형 참고 Arial sans-serif Helvetica로 대체 Courier New monospace 고정폭 로마자, Courier의 대체버전 Georgia serif MS Times New Roman serif 타.. 공감수 0 댓글수 0 2023. 2. 8.
[CSS] MDN 과제: 멋진 박스 만들기 (Assessment wanted for A cool-looking box) This is a cool box html { font-family: sans-serif; } /* Your CSS below here */ p { /* box */ width: 200px; height: 200px; margin: auto; /* 좌우 가운데 설정 */ border-radius: 10px; border: 1px solid darkred; background-color: red; background-image: linear-gradient(to bottom right, rgba(0,0,0,0), rgba(0,0,0,0.2) 30%,rgba(0,0,0,0.2) 100%); box-shadow: inset 2px 2px 3px rgba(255,255,255,0.6), inset -2px -2.. 공감수 0 댓글수 0 2023. 2. 3.
[CSS] MDN 과제: 이쁜 레터 모양 종이 만들기 (Assessment wanted for Creating fancy letterheaded paper) Awesome Company The Awesome Company 102-112 Frail Bend Bridge The Dwindlings Little Hornet HX3 9ZQ UK * { box-sizing: border-box; } html { font-family: sans-serif; } body { margin: 0; background: #ccc; } article { width: 210mm; height: 297mm; margin: 20px auto; position: relative; } address { position: absolute; bottom: 8mm; right: 20mm; } h1 { position: absolute; top: 12mm; left: 20mm; width: 1.. 공감수 0 댓글수 0 2023. 2. 3.
[CSS] MDN 과제: 기본적인 CSS이해 Chris Mills 50 My Street The Town Gray Peach UK ZO50 1MU Tel: 01234 567 890 Mail: chris@nothere.com Editing, writing, and web development services /* General styles - put these straight into your stylesheet */ body { margin: 0; } html { font-family: 'Helvetica neue', Arial, 'sans serif'; font-size: 10px; background-color: #ccc; } .card { width: 35em; height: 22em; margin: 5em auto; background-co.. 공감수 0 댓글수 0 2023. 2. 3.
[Java] 자료구조01 : 입출력, 변수, 배열, 반복문 권오흠 교수님 2016 Java로 배우는 자료구조 ▶ 강의자료 더보기 http://alg.pknu.ac.kr/t/2016-2017-java/342 C에서의 소스코드 = Java에서 class class의 이름은 대문자로 시작 class의 이름과 파일명이 일치해야함 -> refactor > rename 이용 출력 public class Hello { public static void main(String[] args) { System.out.println("Hello Java !!!"); } } main(Strong[] args) : main method (C: main 함수) C는 함수들의 집합, Java는 클래스의 집합 클래스 : 함수들의 집합 ctrl + i : 들여쓰기 각각의 클래스가 메인함수를 가.. 공감수 0 댓글수 0 2023. 1. 9.
[CSS] MDN 정리2 계단식 및 상속 계단식 Cascading Style Sheet : 계단식 동일한 우선순위의 두 규칙 -> 마지막 규칙 적용 우선순위 선택자의 선택이 얼마나 중요한가 요소 선택자는 덜 구체적 -> 중요도↓ class 선택자는 구체적 -> 중요도↑ 상속 부모 요소에 적용된 CSS 속성은 자식요소에게 상속 width와 같은 일부 속성은 상속X 작동방식 상속 색상 : 직접 자식 + 간접 자식에 적용 special class 추가 상식적으로 상속됨 상속 제어 inherit : 상속에 영향O initial : 속성값이 상속 대신 기본 스타일시트 속성값 inherit unset : natural 값으로 재설정 (상속되면 inherit, 상속안되면 initial) 모든 속성 값 재설정 all : 상속 값을 모든 속성에.. 공감수 1 댓글수 0 2023. 1. 4.
[CSS] MDN 정리1 CSS 구문 CSS 규칙 h1 { color: red; font-size: 5em; } selector 중괄호 : 선언블록 선언 속성: 값 대소문자 구분 CSS 모듈 배경 및 테두리 모듈 CSS Working Group이 개발, 지정 CSS 시작하기 CSS 추가하기 head에 태그 추가 HTML 요소 스타일링 HTML 요소 = 선택자 다중 선택 : 쉼표 기본 동작 변경 가능 (list-style-type) class 항목 하나 항목 둘 항목 셋 /* CSS */ .special { color: orange; font-weight: bold; } 해당 class 를 가진 모든 요소를 대상으로 함 요소.class 가능 (li.special) 문서 위치에 따라 스타일 지정 li em { color: rebec.. 공감수 1 댓글수 1 2023. 1. 4.
[html] MDN 정리3 table : table data : table row : thable header colspan="2" rowspan="2" - : col마다 스타일 지정 : 주로 th의 첫번째 행, 바로 아래 : 마지막 행 : 나머지 부분 nested table 중첩 가능 연관성 : 헤더가 행/열의 헤더임을 나타냄 id & header 공감수 1 댓글수 1 2023. 1. 4.
[html] MDN 정리2 이미지 : void element (자식노드X, 닫는 태그X), repalced element (스타일 적용X) src : URL alt : 이미지를 불러올 수 없을 경우 대체 텍스트 width : 가로 사이즈 height : 세로 사이즈 title : 추가 설명, 굳이 권장X - : 이미지와 캡션을 의미있게 연결 A T-Rex on display in the Manchester University Museum CSS background-image HTML image보다 위치조정이 쉬움 의미없는 장식용 이미지 p { background-image: url("images/dinosaur.jpg"); } 비디오/오디오 비디오 Your browser doesn't support HTML video. Here .. 공감수 0 댓글수 0 2023. 1. 3.
[html] MDN 정리1 HTML Element의 구조 content 단일태그 : 속성 요소-속성, 속성-속성 사이 공백 속성 다음엔 등호(=) 속성값은 " "로 감싸기 생략 가능 but 오류 야기 ' ' & " " : 모두 가능하지만 혼용X 특수문자 표시에는 HTML entities 사용 bool 속성 : 값이 없는 속성, 속성의 이름과 동일한 하나의 값만 가질 수 있음 속성 사용 태그 역할 속성 사용 태그 역할 href 웹주소로 연결 title 링크에 대한 추가정보 target _blank: 새탭에서 열기 disabled bool 입력 비활성화 lang , 언어 설정 블럭 레벨 vs 인라인 블록레벨 줄바꿈 구조적 요소를 나타냄 단락, 목록, 네비게이션 메뉴, 꼬리말 표현 중첩 : 블록 ⊃ 블록 / 인라인 !⊃ 블록 인라인 항.. 공감수 0 댓글수 0 2022. 12. 27.
[Programming] 쉽게 풀어쓴 C언어 Express 8장 풀이 01. 주어진 실수를 제곱하여 반환하는 함수 double square(double)을 작성한다. square() 함수를 테스트하는 프로그램을 작성하라. Hint : double형을 입력받을 때는 scanf("%lf", &x)를 사용한다 #include #pragma warning (disable:4996) double square(double x) { return x * x; } int main() { double x; printf("정수를 입력하시오: "); scanf("%lf", &x); printf("주어진 정수 %lf의 제곱은 %lf입니다.\n", x, square(x)); } 02. 전달된 문자가 알파벳 문자인지 아닌지를 검사하는 함수 check_alpha()를 작성하고 이것을 호출하여서 사용자.. 공감수 0 댓글수 0 2022. 12. 10.
[JS 클론코딩] 노마드코더 JS크롬앱만들기 console.log("str"); console에 괄호 안의 내용 출력 MDN Mozilla Developer Network VS Code 단축키 다중선택 Alt + Click Shift + Alt + 드래그 Alt + Click -> Shift + 방향키 변수 const a : 상수, 변경 불가 //default let a : 변경 가능 //업데이트가 필요한 경우 var : 구버전, 변경에 대한 규칙X, 비추천 데이터 타입 boolean : true, false null :없다, 비어있음을 명시 undefined : 정의되지 않음 배열 const name = [1 ,null ,true ,"hi" ]; 데이터 타입 상관X .push() : 배열 추가 오브젝트 const player = { name: ".. 공감수 0 댓글수 0 2022. 11. 7.
[CSS] 생활코딩 반응형 디자인, 미디어쿼리, CSS 파일 반응형 디자인 (responsive design) 화면 크기에 따라 웹 페이지 각 요소가 최적화되는 디자인 미디어 쿼리 조건문 CSS @media(min-width:800px) { } 중복제거 : CSS 파일 * 공감수 0 댓글수 0 2022. 11. 5.
[CSS] 생활코딩 box model : block, inline, div, span, grid *주석 : /* */ *element = tag 태그 별로 화면에서 차지하는 크기에 따라 기본값 구분 1. block 화면 전체를 차지 2. inline 필요한 자신의 부피만 차지 display block 변경 inline none 숨기기 타이핑 줄이기 같은 내용의 스타일 적용 : 콤마로 잇기 같은 속성의 세부 옵션 : 속성 뒤에 순서없이 작성 주요 CSS 속성 border 테두리 padding 안쪽 여백 margin 바깥 여백 width 크기 display 화면 차지 공간 div division 무색무취, 아무런 용도 없이 디자인 용도로만 사용 block : 화면 전체 사용, 줄바꿈 span div와 같이 디자인 용도 inline level element grid display: gird; gird-t.. 공감수 0 댓글수 0 2022. 11. 5.
[CSS] 기초 복습 : id, class, - 디자인에 관한 정보만 지님 1. style 태그를 쓴다 - 에 작성 - a { color:red; } - 중복된 제거 a : 선택자 { } : 선언자 color : 속성 red : value 2. style 속성을 쓴다 - 태그 안에 작성 : 단락 위에 여백 삽입 : 크기 조정 id #id : 최우선 선택자 단 한번만 등장해야 함 구체적, 예외적 #id ul : id div 아래 ul에만 적용시키도록 설정 class .class : 선택자 : 여러개의 속성 값 가능, 띄어쓰기 구분 여러개의 선택자를 통해 공동 제어 가능 중간 우선순위 : body와 가까이 있는 명령이 우선순위 태그 선택자 우선순위 가장 낮음 가장 마지막 등장하는 선택자가 우선순위가 높음 공감수 0 댓글수 0 2022. 11. 5.
[HTML] 기초 복습 닫을 필요 없는 경우 : *로 표시 1. * : html로 구성된 웹임을 알려줌 2. : head와 body를 묶음 3. : 본문을 설명하는 묶음 : 웹페이지의 제목 * : UTF-8 방식으로 해석되어야 함을 알려줌 : CSS를 포함하는 태그 4. : 본문 묶음 ~ : Heading, 제목 : 단락 : 굵게, 두껍게 강조 : 밑줄 강조 : 글씨 설정 관련 태그 : anchar, 링크 herf=" " HyperText Reference, 주소 target=" " 페이지 열리는 속성 _blank : 새창에서 title=" " 이미지 내용 설명 * : 줄바꿈 * : 이미지 5. : 주석처리 공감수 0 댓글수 0 2022. 11. 5.
[Linux] 흐름제어(if-else, for, case, select, while, until), Exit Status, 조건검사, 파일속성검사, 정수조건검사, 문자열비교 ※ Linux Fundamentals 교재를 참고하였습니다! if / else if condition then statements [elif condition then statements] [else statements] fi [condition] ; boolen이 아니라 실행가능 명령 정상 실행 : 참 실행 오류 : 거짓 한줄에 적을 경우 if condition; then; statement Exit Status UNIX 명령어는 실행 후 하나의 정수 반환 exit code 정상종료 = 0 오류 = 0이 아닌 값 조건 검사 명령 [ ... ] : 하나의 명령, 참이면 exit status 0, 아니면 1 괄호 사이는 반드시 공백문자 문자열 비교, 파일 속성 검사 [ string1 == string2 ].. 공감수 4 댓글수 0 2022. 10. 21.
[Linux] 쉘 프로그래밍, 문자열 연산, 명령어 대입 ※ Linux Fundamentals 교재를 참고하였습니다! 쉘 프로그래밍 : 리눅스 명령어를 사용하여 일정 동작을 수행하도록 쉘 스크립트 작성 쉘 스크립트 리눅스 명령어 포함 소스파일 shell에 의해 해석/실행 쉘 스크립트 작성 vi 또는 gedit 으로 작성 작성한 스크립트파일에 실행 권한 추가 (chmod) 쉘 스크립트 실행 $bash script-name : 쉘 프로그램 명시 $ ./script-name : 절대경로명 입력 exit 필요 $ . ./script-name : . = 현재 shell 실행명령, 이후는 경로명(pwd) $ source script-name : 현재 dir, 현재 shell에서 실행 스크립트 파일 디렉토리를 PATH 환경병수에 추가 $export PATH=$PATH:~/.. 공감수 1 댓글수 0 2022. 10. 21.
[Linux] 파일보안 ※ Linux Fundamentals 교재를 참고하였습니다! 파일 파일 소유권 리눅스 모든 파일에는 소유자와 소유그룹 부여 chgrp [group name] [file name] : 소유그룹 변경 chown [user name] [file name] : 소유자 변경 chown [user name]: [group name] [file name] : 소유자와 그룹 동시에 변경 파일 종류 파일정보의 첫문자 파일종류 - 일반파일 d 디렉토리 파일 접근 권한 사용자 : 그룹 : 기타사용자 3문자씩(rwx) 표현 r 파일 내용 읽기(cat) 디렉토리 내용 읽기(ls) w 파일 내용 추가/삭제/갱신 디렉토리내 파일 생성 가능 x 파일 실행 디렉토리 진입(cd) chmod 접근권한 변경 chmod [옵션] Mod, [.. 공감수 5 댓글수 0 2022. 10. 20.
[Linux] 패키지, 시스템 관리, Linux 부팅 및 종료, 시스템 모니터링 ※ Linux Fundamentals 교재를 참고하였습니다! 소프트웨어 패키지 리눅스의 소프트웨어 패키지 중앙집중식, 일관적 패키지 : 응용프로그램, 라이브러리, 버전정보 등 포함 .deb : Ubuntu 포함 Devian 계열 .rpm : Red Hat 계열 패키지는 Repository에 저장, HTTP or FTP 서버를 통해 제공 소프트웨어 패키지 관리 GNOME GUI : 소프트웨어 업데이터 메뉴 패키지 Repository가 /etc/apt/sources.list 파일에 추가 $sudo apt update : 패키지 Repository 리스트의 업데이트 설치 패키지명 찾기 http://packages.debian.org http://packages.ubuntu.com $apt search 소프트웨.. 공감수 2 댓글수 0 2022. 10. 20.
[Linux] 사용자 관리 ※ Linux Fundamentals 교재를 참고하였습니다! 사용자 관련 명령 whoami 현재사용자 알려줌 who 로그인 사용자 정보 보여줌 w 로그인 사용자 수행중인 태스크 보여줌 id 현재 사용자 ID, 그룹ID, 소속그룹 보여줌 su 명령 substitute user su [-] [username] 다른 사용자ID로 새로운 쉘 시작 user id 없는 경우 root 사용자 - : 기존 로그인환경 변경 적용(환경변수, 현재 디렉토리) exit: 새로 생성된 쉘 빠져나옴 sudo 명령 다른 사용자로 명령 수행 sudo su - : Ubuntu에서는 sudo를 통해서만 root 사용자로 쉘 사용 가능 /var/log/auth.log : root 사용자 sudo 사용내역 확인 사용자 관련 편집 /etc/.. 공감수 0 댓글수 0 2022. 10. 20.
[Linux] Text Editor, 정규식 : grep, seb, vi ※ Linux Fundamentals 교재를 참고하였습니다! gedit GNU GPL 라이선스의 GUI 기반 텍스트 편집기 우분투 데스크탑 공식 텍스트 편집기 gedit 파일명 & : 백그라운드에서 동작하여 명령을 입력받지 않도록 함 vi Editor Visual Editor 키보드만으로 모든 기능 사용 가능 동작모드 명령모드 : 기본모드, 커서이동, 복사, 다른모드 전환 가능 명령행모드(:) : 명령을 입력하여 문자열 검색, 치환, 저장, 종료 입력모드(a/i) : 텍스트로 입력 비주얼 모드(v) : 텍스트 선택 커서이동 h j k l : 왼 아래 위 오 입력모드 : Alt + h j k l 주요명령 명령행모드 :w write, vi 입력내용 저장 :q quit, vi 나감 :_! 강제적 : 숫자 d/.. 공감수 4 댓글수 2 2022. 10. 19.
[Linux] I/O 리다이렉션, 파이프, 필터(cat, grep), find, locate, sleep, time ※ Linux Fundamentals 교재를 참고하였습니다! I/O 리다이렉션 표준 입출력 stdin() : 명령 출력, 디폴트 = 터미널 화면 stderr{2>} : 에러 출력, 디폴트 = 터미널 화면 출력 리다이렉션 > : 출력 스트림 변경, 덮어쓰기 >> : 기존의 데이터에 추가 에러 리다이렉션 2> : 에러스트림 변경 2> /dev/null : 에러메시지 무시 2>&1 : stdout과 stderr를 같은 스트림으로 보냄 입력 리다이렉션 표준출력 tee 표준입력 -> 표준출력, 파일 grep 문자열 포함 라인 찾기 tr 문자단위 치환 wc 단어, 라인, 문자수 계산 -w/l/c 단어수만 표시 sort 입력데이터 정렬 -n 문자가 아닌 숫자로 해석 -r 내림차순 uniq 중복 제거 head/tail.. 공감수 0 댓글수 0 2022. 10. 18.
[Linux] 파일이름 확장, 문자패턴 ※ Linux Fundamentals 교재를 참고하였습니다! 파일이름 확장, 문자패턴 * 없거나 하나 이상의 임의의 글자 ? 임의의 한글자 [ 문자, 문자 ] 대괄호 사이의 임의의 문자 중 해당하는 것 [a-z] : 여러개 문자 간략히 표시 [!ab] : 문자가 들어가지 않음을 의미 공감수 0 댓글수 0 2022. 10. 18.
[Linux] 작업제어 연산자, 쉘변수 ※ Linux Fundamentals 교재를 참고하였습니다! 작업제어 연산자 다수의 명령을 처리하는 연산자 ; 명령을 왼편 -> 오른편의 순서로 차례로 수행 & 명령을 백그라운드로 실행 종료할 때까지 기다리지 않고 쉘이 다음 명령 대기 [1] 20220 와 같이 job number와 CPU번호 표시 $? 이전 명령의 종료코드 반환 (성공=0, 실패!=0) && AND 왼편이 성공적으로 종료하면 오른편 실행 || OR 왼편이 실패할때만 오픈편 실행 # 주석 \ escape 문자 ~ \ 명령행의 끝에 위치하면 명령행이 다음 행으로 이어짐을 의미 쉘 변수 $를 사용 대소문자 구분 쌍따옴표 스트링은 쉘이 해석 set : 모든 변수의 값 확인 unset : 변수 삭제 주요 변수 $HOSTNAME 호스트 컴퓨터의 .. 공감수 0 댓글수 0 2022. 10. 18.
[Linux] 쉘(shell) 확장, 명령인자, type, which, alias ※ Linux Fundamentals 교재를 참고하였습니다! Shell 확장 명령행을 Linux의 쉘이 해석하는 과정 사용자 입력 명령행 -> 쉘 확장 -> 쉘에 의해 실행 bash(Bourne again shell) : 리눅스에서 가장 널리 사용되는 쉘 set -x 쉘 확장과정 표시 끄려면 +x 명령 빌트인 명령 : 쉘 자체적 해석 외부 명령 : 바이너리 파일에 해당하는 명령, PATH 등록 순으로 외부명령 탐색 내부명령 > 외부명령 type -a (all) 명령의 종류 확인 which 외부명령 바이너리 파일의 위치 알려줌 alias 기존의 명령을 다른 이름으로 사용 묶인 문자열은 단일 인자로 처리, 공백문자 유지 따옴표 : 강력 쌍따옴표 : 변수 인식 공감수 0 댓글수 0 2022. 10. 18.
[Linux] 파일명령 : touch, rm, mv, cat, rename ※ Linux Fundamentals 교재를 참고하였습니다! 파일 관리 명령 file 파일의 종류 알려줌 touch empty 파일 생성 시간속성 변경 rm 파일 삭제 -i : interactive 대화형, 사용자에게 묻고 삭제 -r : recursive 재귀적, 하위 디렉토리도 삭제 -f : force 강제적, 디렉토리 내 파일도 삭제 cp 파일 복사 -r : 재귀적, 하위디렉토리 및 파일도 복사 -i : 대화형으로 복사 mv 파일 이동 이름 변경 rename 이름변경 / 복잡하여 잘 사용하지 않음 파일 보기 명령 head text의 앞 일부 (default = 10) tail text의 끝 일부 cat 파일 전체 내용 표준출력 more 파일 내용 화면 크기단위 less 화살표 사용 가능 공감수 0 댓글수 0 2022. 10. 18.
[Linux] Linux의 계층구조 계층구조 루트를 최상위로 하는 트리형 계층구조 그림출저 : insidelTworld 파일 : 데이터 덩어리 대소문자 구분 모든것을 파일로 간주 디렉토리도 파일의 한 종류 하드웨어도 파일로 간주 디렉토리 : 윈도우의 폴더 경로 : 루트 ~ 특정 파일까지의 디렉토리&파일명 상대경로 : 현재 디렉토리로 시작하여 나타냄 더보기 /home/oss/book/woonderland 루트(/) : 최상위 현재 디렉토리 : 쉘이 현재 위치, 상대경로 특수 디렉토리 . : 현재 디렉토리 .. : 부모 디렉토리 홈 디렉토리(~USERNAME) : 사용자별 제공, 사용자명 생략시 현재 사용자 디렉토리 바이너리 디렉토리 기계어 명령 파일들을 유지하는 디렉토리 /bin 모든 사용자들이 사용하는 파일 (명령) /sbin 시스템 설정.. 공감수 0 댓글수 0 2022. 10. 18.
[Linux] 기본명령 : man, pwd, cd, ls, mkdir, rmdir | 단축키 ※ Linux Fundamentals 교재를 참고하였습니다! 기본명령 man manual 명령어 설명 pwd print working dir 현재 작업 디렉토리 알려줌 cd change dir 디렉토리 이동 ls list 디렉토리 내 파일 보여줌 -a : 감춰진 파일까지 모두 -l : 상세 정보 mkdir make dir 디렉토리 생성 참고 Enter는 한줄씩, SpaceBar는 한페이지씩 넘김 q 를 누르면 escape tab을 누르면 자동입력 제어키 Ctrl C 명령 STOP Ctrl D 입력 종료 Ctrl \ 명령 STOP (C보다 강력) Ctrl S 스크린 출력 멈춤 Ctrl Q 스크린 출력 재개 DEL or Ctrl ? 이전문자 삭제 Ctrl U 전체 삭제 Ctrl Z 명령 잠시 멈춤 공감수 0 댓글수 0 2022. 10. 18.

문의안내

티스토리
로그인
고객센터

티스토리는 카카오에서 사랑을 담아 만듭니다.