전체 글159 z-index z-index 보통 가장 나중에 작성된 마크업 요소가 가장 앞으로 튀어 나오게 된다. 만약 다른 쌓임 순서를 적용하고 싶다면 먼저 엘리먼트에 position ( static 말고 다른 값 ) 을 주면 마크업과 상관없이 앞으로 튀어나온다. 앞써 position과 비슷한 것이 있는데 transform이다. translate 에 어떤 값이 들어가 있는지 상관없이 ex) transform : translate(0); 작성해주어도 앞으로 튀어나와 있는 결과를 만들 수 있다. 예외적으로 opacity는 투명도인데, 이것의 속성값을 0.9999를 주면 튀어나오는 결과를 만들 수 있다고 한다. 노란색 테두리가 있는 낙타를 '낙타1'이라고 부르겠다. parasol보다 마크업 언어로 뒤쪽에 작성되어 있고, 해당 낙타1의 .. 2022. 8. 10. max-width/max-height max-width 와 max-height는 어떤 요소의 최대 너비와 높이값을 설정하는 속성이다. 반응형 웹디자인에서, 화면에 따라 다르게 스타일을 적용할 때 자주 사용된다. 두 속성 다 주요 브라우저에서 지원하지만 ie6 이전 버전은 지원하지 않는다. (ie7은 doctype을 선언해줘야 함) max-width 속성 어떤 요소의 최대 너비를 지정한다. 요소의 너비값이, max-width 너비값보다 커지는 것을 방지한다. 즉, max-width는 width 속성값을 무효화 시킨다. 이미지 가로 너비가 500px일 떄, max-width:400px 으로 설정하면 400px 이하로만 이미지가 보인다. 속성값 none : 기본값 길이값 - px, cm, em 등 % : 요소를 담고 있는 박스에 비례한 백분율 i.. 2022. 8. 3. form forn은 알게 모르게 웹에서 사용이 많이 된다. 사용자의 의견이나 정보를 알기 위해 입력할 큰 틀을 만드는 데 사용되기 때문이다. form은 입력된 데이터를 한 번에 서버로 전송한다. 전송한 데이터는 웹 서버가 처리하고, 결과에 따른 또 다른 웹 페이지를 보여준다. 1. from 태그 동작방법 1. 폼이 있는 웹 페이지 방분 2. 폼 내용을 입력 3. 폼 안에 있는 모든 데이터를 웹 서버로 보냄. 4. 웹 서버는 받은 폼 데이터를 처리하기 위해 웹 프로그램으로 넘긴다. 5. 웹 프로그램은 폼 데이터를 처리한다. 6. 처리결과에 따른 새로운 html 페이지를 웹 서버에 보낸다. 7. 웹 서버는 받은 html 페이지를 브라우저에 보낸다. 8. 브라우저는 받은 html 페이지를 보여준다. 2. 폼 태그 속성.. 2022. 7. 28. Semantic tag 시맨틱 태그는 HTML5에서 처음 등장한 tag들이다. div 에 class 값을 붙여서 스타일링 하면, 모든 작업이 가능하다. 모든 것을 div로 작성하는 것보다 더 효율적인 방법을 원했고, 브라우저도 다른 개발자도 어느 부분이 제목이고 본문인지 한 눈에 이해할 수 있게 하는 방법을 생각하게 되었다. 그래서 특정한 의미를 가지고 있는 tag들이 등장하게 되었다. semantic tags : 의미가 있는 태그 - semantic tag가 중요한 3가지 이유 1. SEO ( Search engine optimization) 검색을 최적화하기 위해서 우리가 제목, 부제목, 시멘틱 테그를 잘 확용한다면, 특정 키워드로 검색했을 때, 내가 만든 웹사이트가 검색창에 노출될 수 있다. 다시 말해서, 브라우저의 검색.. 2022. 7. 28. 이전 1 ··· 29 30 31 32 다음 728x90
