본문 바로가기

HTML3

CSS로 요소 정중앙에 배치하는 4가지 방법 요소 정중앙 배치하는 방법은 생각보다 다양하다. 나는 주로 display :flex를 많이 쓴다. 정중앙 뿐만아니라 정렬도 할 수 있어서 편한 것도 있고 처음 flex를 배울땐 너무 어려워서 계속 반복하면서 더 써보려고 하다보니 이제는 오히려 더 찾게 되는 것 같다. 그래서 오늘은 요소를 정중앙에 배치하는 방법을 알아보려고 한다. 상황에 따라 원하는 것을 골라 쓰면 될 듯 하다. display: flex; justify-content: center align-items: center; height: 100vh; display: grid; place-items: center; height: 100vh; position: relative; height: 100vh; margin: 0 auto; 2023. 6. 22.
Console.dir이 뭘까? https://developer.mozilla.org/en-US/docs/Web/API/console/dir console: dir() method - Web APIs | MDN The method console.dir() displays an interactive list of the properties of the specified JavaScript object. The output is presented as a hierarchical listing with disclosure triangles that let you see the contents of child objects. developer.mozilla.org 먼저 공식문서를 첨부했다. 그 이후는 내가 이해한 내용을 쉽게 풀어내려고 한다... 2023. 6. 14.
form 태그란 뭘까? https://www.w3schools.com/tags/tag_form.asp HTML form tag W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more. www.w3schools.com 먼저 공식문서를 첨부했다. 그리고 내가 이해한 내용을 써보려고한다. 사용자가 input 창에서 댓글을 쓰면 포커스가 input 창에 있어서 enter를 눌러도 댓글이 올라가지지 않았다. 포커스가 버튼에 있어야만 enter .. 2023. 6. 14.