링크와 이미지를 페이지에 삽입하고 싶을 땐, 각각 a태그와 img태그를 사용한다. 링크는 기본적으로 문서간의 연결을 말하며, 내부나 외부의 링크를 만들 수 있다. 1. a 태그 a태그의 기본적인 형식은 이와 같다. href는 대상 경로이다. 대상의 주소(URL)이나 내부문서의 id속성 값이다. (처음 코드를 구성할 때, 대상 경로가 불확실 한 경우가 있다. 그런 경우에는 href="#"으로 채워두면 잠시 오류를 피할 수 있다.) target은 링크 연결 방식이다. _blank, _parent, _self, _top이 있다. 가장 많이 사용되는 것은 새 창으로 열기인 _blank이다. title은 링크 설명이다. 지정한 경로의 정보가 무엇인지 메모하는 용도이다. a태그를 사용하기 위해서는 href를 필수적..
HTML에서 목록을 생성할 때는 대표적으로 세 가지를 사용할 수 있다. ul, ol, dl인데, 각각 순서 없는, 순서 있는, 정의표현의 역할을 한다. 목차나 메뉴같이 목록이 필요한 부분을 구성할 때 필수적이다. 1. ul 태그 Unordered List의 줄임표현으로, 순서가 없는 목록이라는 의미이다. ul태그 안에 li(list item)을 담는 구성이다. Hello HTML CSS JS 이와 같이 구성한 코드는 다음과 같이 출력된다. 실행결과에서는 보이듯이 글머리 기호가 붙는다. 2. ol 태그 Ordered List의 줄임말로, 순서가 있는 목록이라는 의미이다. ul태그와 마찬가지로 ol태그안에 li를 담는 구성이다. Hello HTML CSS JS 이와 같이 구성한 코드는 다음과 같이 출력된다...
HTML에서 그룹을 만들 수 있는 방법은 두 가지가 있다. div와 span태그이다. div는 블록 요소와 인라인 요소를 한 묶음으로 묶고 싶을 때 사용 가능하다. span은 인라인 요소를 그룹으로 묶을 때 사용 가능하다. 여기서 블록 요소는 태그처럼 하나의 태그가 한 줄의 공간을 차지하는 요소를 말하고, 인라인 요소는 그렇지 않고 실제 존재하는 공간만큼만 공간을 차지하는 요소를 말한다. 각 요소의 형태는 밑의 그림과 같다. 1. div 태그 블록 요소와 인라인 요소를 한 그룹으로 묶고 싶을 때 사용한다. 실제 결과물에는 큰 차이가 없을 수도 있지만, 구분없이 텍스트들만 나열하면 어떤 텍스트가 어디에 쓰려한 것인지 알기 어렵기 때문에 구분을 해주는 것이 보기에 좋다. 예를 들면 다음처럼 활용할 수 있다...
1. 텍스트 작성 1) hn 태그 제목 다음과 같이 사용한다. 여기서 h는 heading, n은 중요도 숫자이며 1부터 6까지 있다. 1이 가장 중요한 텍스트로 가장 크고 6이 가장 작다. 검색엔진에서는 hn태그를 키워드로 인식하므로 검색엔진 최적화를 위해 hn태그를 적절히 사용하는 것이 중요하다. h1 h2 h3 h4 h5 h6 다음과 같은 코드를 실행 시키면 글자크기를 알 수 있는데, 이정도 크기 차이를 보인다. * HTML에서 hn태그는 h1부터 순서대로 인식한다. 따라서 hn태그를 사용할 때는 h1부터 순서대로 사용하고 연속적으로 숫자를 사용해야 한다. 예를 들어서 h1,h2,h4 를 사용하면 h3을 인식하지 못했기 때문에 h1,h2만 출력하고 h4는 출력하지 않는 경우가 생긴다. 2) p태그 본..
HTML이란 Hyper Text Markup Language의 약자로 웹페이지를 만들때 사용하는 마크업 언어이다. HTML 로 구성된 코드로 웹페이지의 구조를 만들 수 있는 것이다. HTML의 기본적인 구조 HTML은 태그를 바탕으로 이루어져 있다. 여기서 태그는 HTML 문법을 이루는 가장 작은 단위로 웹페이지에서 사용되는 다양한 구성요소들을 정의한다. 태그는 다음과 같이 사용한다. 따라서 태그들을 사용한 기본적인 구조는 다음과 같다. 시작태그는 , 끝 태그는 과 같이 쓴다. 태그의 위치에 따라 상위 태그는 부모 하위태그는 자식, 부모가 같은 태그는 형제 태그라 부른다. * HTML에서 주석은 와 같이 쓴다.
1. 체크박스 Checkbox라는 함수를 통해 구현해 낼 수 있다. 말 그대로 체크를 할 수 있는 네모박스이며 bool 값으로 클릭 시 체크, 체크해제를 할 수 있다. void main() { runApp(MaterialApp( home: Scaffold( appBar: AppBar( title: Text('Flutter의 입력'), ), body: Body(), ), )); } class Body extends StatelessWidget { const Body({super.key}); @override Widget build(BuildContext context) { return Column( children: [ TestCheckBox(), ], ); } } class TestCheckBox ext..
기능 MaterialApp : 가장 기본이 되는 위젯트리의 최상위 앱 Scaffold : 가장 기본이 되는 도화지, 기본 빈 화면을 만들기 좋을 기능 stless : 상속 위젯을 만들 수 있음, return으로 위젯 정보 넣기 단축키 Ctrl + Alt + l : 보기좋게 정렬 Alt + Enter : 감싸기 (Wrap) , ex) 위젯으로 감싸기 Shift + F6 : refactor 변수명, 객체명을 한번에 바꾼다. 예시 import 'package:flutter/material.dart'; void main() { runApp(MaterialApp( home: Scaffold( appBar: AppBar(//상단 표시 바 생성 actions: [ IconButton(//아이콘을 만든다 icon: I..
1. 사용자 등록, ssh키 발급 git config --global user.name "name" git config --global user.email "email@hello.com" 다음과 같은 명령어로 user의 이름과 eamil을 등록할 수 있다. 등록 후 git config --list 를 통해서 user.name과 user.email이 잘 등록되었는지 확인해준다. 이후 ssh키를 등록하는 작업을 진행해준다. ssh키를 등록하면 암호화된 코드로 이 컴퓨터와는 별도의 비밀번호 없이 git을 연결할 수 있다. 먼저 mkdir ~/.ssh 로 ssh 폴더를 만들어준다. cd ~/.ssh cd 명령어로 ssh 폴더에서 작업하도록 이동한다. ssh-keygen -t ed25519 -C "email@he..