본문 바로가기

공부

 (171)
2019-04-04 내가 생각한대로 작성하면 이런식으로 나올거라 생각했다. 근데 select태그랑 a태그가 붙어서나와서, 어디선가 인라인된다는것은 알았는데 어디서되는질 몰랐다 확실히 ul쪽에선 블록화되고 있고, 알아보니 selcet태그가 inline-block ( a링크를 내리고 잡히는 영역을보니 자신 부분만 차지) a태그가 inline블록이라는점을 배웠다. 지금 이구조에선 nav영역에 블록|인라인블록|인라인 이렇게 쌓여있으니, 딱히 무언가 할필요없이 배치만해도 레이아웃이 될것 같다
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 이벤트 전파 DIV 태그 안에 P태그 안에 SPAN태그가 있을시, -> DIV클릭, (DIV 영역만) -> SPAN클릭 ( DIV~ SPAN) 이벤트 전파 $(document).ready(function(e){ e.preventDefault(); 이벤트 전파 방지 window.onload 모든body태그들이 출력된 다음 호출이 되는 코드 html파일이 로딩이 되면 ... 이라는 느낌 웹페이지 전체가 로드가 완료되면 함수처리 폼태그의 서브밋 이벤트가 발생하면 , 함수호출 (이벤트).preventDefalut 이벤트 기본동작 x 소스코드 위 아래 스크립트 onload
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 외부에 저장해두면..
[CSS]float float은 띄우다,뜨다 라는 뜻으로 block 태그에만 사용가능하며, 속성값은 none,left,right,initial,inherit등을 갖는다. 블록태그에만 올 수 있기때문에 밑에 인라인 상자가 올 수 없어서 그림과 같은 상황 발생시, 밀어낸다
[Css] margin 0px auto block 태그 중앙정렬 그림과 같은 Box를 margin: 0px auto 주는 것이 왜 중앙 정렬이 되는 것일까? 마진 값을 주는 방식 중 2개만 주는 방법이고 (0~4개까지) 2개만 주게 되면 앞에 것은 상하, 뒤에 것은 좌우가 된다. 즉 상하 마진을 0, 좌우 마진을 auto로 줘서 중앙 정렬이 된 것처럼 보이게 하는 기능이다. 그림이 있다 안에 block 박스를 마진 0, auto를 주면 (패딩, 보더 생각 xxx) 아래 그림처럼 상하는 꽉 채우고 좌우 정렬이 된 것 같은 효과를 낸다. margin:0 auto가 정렬이 되지 않는 case 1.inline 태그들 해결방법ㅡ>: display :block 2.width 값이 없을 때 // 말이 되는가? 의문이 생기고있다 해결방법ㅡ> margin은 width 값이 존재한다는..
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

티스토리툴바