본문 바로가기

전체 보기

 (223)
2019-04-06 프로그램 :해야할일의 순서 tv 프로그램, ex) MT행사 프로그램을 짠다 공연 프로그램을 만든다 = 컴퓨터가 할일을 쓴다 사용자 > 프론트앤드(브라우저) 사용자입장 백엔드(서버) 운영자 입장 웹브라우저에서 돌아가는 프로그램을 작성하는 사람 = 웹 프로그래머 하이퍼텍스트 : 문서와 문서가 연결되어 있는것 http:하이퍼 텍스트들을 교화하기 위한 규약 web server : html, css javascript DB Server : 로그인 , 회원가입 Image Sever: 인스타 Cache Sever 미리 가공된 페이지(미리 만들어 놓고 빠른 속도로 제공) Html: 레이아웃, 그림 그릴때 스케치(메이크업에서 기초) Css:레이아웃을 그럴듯하게 꾸밈, 그림에서 색칠(메이크업에서 색조) JavaScript..
2019-04-06 다시한번더 html 마크업의 기초 태그, 속성, 논리속성 태그부터 안에 있는 속성까지를 모두 '요소' 섹셔닝 루트(Sectioning Root) , , , , , 몇몇 요소는 섹셔닝 루트라는 그룹으로 구분합니다. 섹셔닝 루트에 속하는 요소는 section이나 article 요소와 같이 장이나 절과 같은 계층 구조로 구분되지 않고 독립적인 콘텐츠로 분리되기 때문에 아웃라인에 영향을 주지 않습니다. 섹셔닝 콘텐츠(Sectioning Content) , , , 섹셔닝 콘텐츠는 대부분 HTML5에서 새롭게 추가된 요소들이며, 제목과 그 내용을 포함한 범위를 지정하는 콘텐츠를 나타냅니다. 모든 섹셔닝 콘텐츠는 헤딩과 아웃라인을 가집니다. 헤딩 콘텐츠(Heading Content) , , , , , 헤딩 콘텐츠는 ..
2019-04-05 term 섹션을 구성함에 있어서 ul로 해보려고했는데 dl이라는 태그를 처음사용해보았고, (dt,dd를 가질 수 있음) div태그 영역안에 컨텐츠들을 모두 float처리하니 (float는 공중에 있으니) width값을 줘야한다는점 block 상자라는 것은 width값을 줄 수 있다는점 인라인은 컨텐츠 크기만큼 차지하니까 width값 xx padding같은 고정값은 최대한 안건들이는게 유지보수 관점에서 좋다는점 clear:both를 사용하면 강제마진효과( 조건은 display:block) 음수마진의 특성은 상자가 작아지고 , 패딩은 예측이 가능한대신 음수를 사용할 수 없다는점 div태그를 써서 만든 상자에 컨텐츠들을 모두 float하였으니 컨텐츠가 없는것이라 판단되 div태그의 높이가 줄어든다 그것을 방지..
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 내가 생각한대로 작성하면 이런식으로 나올거라 생각했다. 근데 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 외부에 저장해두면..

티스토리툴바