본문 바로가기

공부/TIL

 (105)
2019-04-06 다시한번더 html 마크업의 기초 태그, 속성, 논리속성 태그부터 안에 있는 속성까지를 모두 '요소' 섹셔닝 루트(Sectioning Root) , , , , , 몇몇 요소는 섹셔닝 루트라는 그룹으로 구분합니다. 섹셔닝 루트에 속하는 요소는 section이나 article 요소와 같이 장이나 절과 같은 계층 구조로 구분되지 않고 독립적인 콘텐츠로 분리되기 때문에 아웃라인에 영향을 주지 않습니다. 섹셔닝 콘텐츠(Sectioning Content) , , , 섹셔닝 콘텐츠는 대부분 HTML5에서 새롭게 추가된 요소들이며, 제목과 그 내용을 포함한 범위를 지정하는 콘텐츠를 나타냅니다. 모든 섹셔닝 콘텐츠는 헤딩과 아웃라인을 가집니다. 헤딩 콘텐츠(Heading Content) , , , , , 헤딩 콘텐츠는 ..
2019-04-05 박스모델 괜찮은거같음 inline +/블록 ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ (폼) 1.로그인 2.아이디 , input상자 3.비밀번호 , input상자 4로그인 버튼 5 텍스트 링크 모음 (논리적인순서) ! 노트 ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ required // 사용자가 입력하지 않았을시 서버까지 보내지않고 클라이언트 측에서 서버까지 안가게하기 input type="email" id="user-email" name="uid" required placeholder="mail@mail.com" https://miketaylr.com/pres/html5/forms2.html 폼관련 요소 버튼 = 보더박스 div = 컨텐츠 박스 *구조선택자* ..
2019-04-04 LINE 라인의 메인이므로 h1이 높을확률이 높음 *nav요소는 한개만 사용하는게 좋음* ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ float : 가로 방향 (공백발생 x ) position :거리가 뚝떨어져있는곳 : 자식들을 absolute로 inline-block : 가로방향 (공백문자가 발생할 수 있음) sub menu는 인라인블록처리 menu > li 자식선택자 ( 바로 이자식만 선택) 누구를선택했고, 그게 누구한테 영향을 주는구나 상자의 가운데 넣는듯한 효과 ( 상자의 높이 = line-height 높이 주기) 마치 중간에있는것처럼 느껴지기 *검색해보기 height line-height* inline상자와 block의 특징을 좀보자 6개 menu-..
2019-04-02 float과 clearfix 명확하게 답이 안나옴 (논리적이지 못하다 ㅡ> css라는 언어를 이해 x) 상속으로부터 물려받았겠구나 자식의 값이 나에게 반영됫겠구나 CSS에서 중요한것 (핵심) 1.상속 (부모한테 지정한 속성 자식한테도 그대로) -- 상속을 잘이해야함 2.겹침 (옷여러벌 껴입기) 3.우선순위 (선택자중의 우선순위) 레이아웃 (box모델 기준 w/h+p+b+m) 관점 1.POSITION 2.FLOAT 3.DISPLAY block inline inline-block flex grid +추가적으로 box-sizing (content-box, border-box(마진만)) 여기까지 알고 프로젝트 해보면됨 (아예 처음부터 프로젝트하면 나쁜 습관듬) 임배디드 OR 인터널 방식 CSS 외부에 저장해두면..
2019-04-01 주제 : 웹접근성과 웹표준 학습목표: 웹접근성과 웹표준의 기본 개념을 파악하고 웹표준을 준수하는 것이 웹접근성 관점에서 왜 필요한지 살펴본다. 세부내용 : - 웹접근성이란? 웹표준 관련 기술 구조와 표현 및 동작 OpenWax를 활용한 웹접근성 점검 - 사다리 모양 점수체크 Web Developer Tool 활용 ㅡ 크롬 확장프로그램(?) 톱니바퀴 모양 설치 문법 검사(Validation) ㅡ https://validator.w3.org/ https://jigsaw.w3.org/css-validator/ 오늘 웹 접근성과 웹 표준에 대해서 많이 배웠는데, 잘 기억나지 않는다 이런 지식을 이 배웠으나 기억나지 않는 지식일 것 같다. 웹의 전반적인 역사, web 표준은 w3c web accessibility..
2019-03-30
2019-03-29 _position_ absolute는 가장 가까운 부모 중 relative를 찾아서 그 친구를 기준으로 위치가 형성된다(?) 그림처럼, 세 개의 공간에 가장 큰공간이 postion relative, 가운데가 static( 기본값이 static으로 알고 있음)가장 작은 공간을 absolute로 잡고 (파란색 공간이 없다고 가정) 추가적으로 가장 작은 공간에 top : x px;을 준다면 두 번째 static을 넘어서 가장 큰 relative의 top부터 x 픽셀 떨어진 곳에 위치해서 파란색 공간 느낌으로 차지하게 되는 것 같다 그에 비해 fixed는 간단한것 같다.'보이는 화면'의 위치이기 때문이다. fixde로 가운데다 지정해놨으면 마우스로 움직여도 그 위치가 항상 고정되어있다 화면에 벚꽃띄우는 효과를 ..
2019-03-26 name = bs name = "bs" name = 'bs' 의 차이name = bs name이라는 변수에 bs라는 값을 할당name ="bs", 'bs' name이라는 변수에 "bs" 'bs'문자열 할당 왜? 문자열을 ""없이 표기하면 변수 혹은 예약어와 헷갈릴 수 있다.""과 ''를 언제 나눠서 쓰나요?name = "ja'ke", 'ja"ke', "ja"ke" escape처리같은 어떤 특별한 목적이 있을때 셀렉터의 우선순위 ㅡ> class="클래스" ㅡ> ID="아이디"simple ㅡ> complex순 웹브라우저가 문서를 표기하는 순서1.HTML 로드 2.DOM 객체 생성 3.$(DOCUMNET).READY()실행 4.이미지 등 요소 로드5.페이지 로딩 완료66.$(window).ready()

티스토리툴바