본문 바로가기

728x90

Web Development/HTML & CSS

(4)
[HTML/JS] Custom Element 구현하기 정의 규칙 글자 가운데 -를 하나 이상 포함해야 한다. 사용법 예시 6/11/2017, 11:55:49 class CurrentTime extends HTMLElement { constructor() { // 클래스 초기화. 속성이나 하위 노드는 접근할 수는 없다. super(); } static get observedAttributes() { // 모니터링 할 속성 이름 return ['locale']; } connectedCallback() { // DOM에 추가되었다. 렌더링 등의 처리를 하자. this.start(); } disconnectedCallback() { // DOM에서 제거되었다. 엘리먼트를 정리하는 일을 하자. this.stop(); } attributeChangedCallback(..
[EJS] ejs 사용 튜토리얼 ejs란? ejs는 Embedded JavaScript의 약자로, 자바스크립트가 내장되어 있는 html 파일을 의미한다 html 파일과의 차이점은 html 안에 내장되어 있는 것과 바깥에서 건드리는 것의 차이이다. 즉, ejs는 html의 태그처럼 자바스크립트 내용을 삽입할 수 있다. 일반 html 파일은 무조건 태그를 이용해 분리를 시켜야하지만, ejs는 지정된 태그를 통해 스크립트 내용을 하나의 요소처럼 사용될 수 있게 한다. 또한 서버에서 보낸 변수를 가져와 사용할 수 있다 ejs에는 자바스크립트를 내장 시킬 수 있는 2가지의 태그가 있다. 태그 안에는 무조건 자바스크립트 코드가 들어가야한다. 그리고 줄바꿈을 하면 새로운 를 이용해야 한다. 안방으로 들어왔습니다. or 태그 두 가지 표기법이 있지만..
[CSS] display:flex와 float:right이 함께 적용되지 않을 때 해결방법 You can't use float inside flex container and the reason is that float property does not apply to flex-level boxes . So if you want to position child element to right of parent element you can use margin-left: auto but now child element will also push other div to the right 결론: display:flex를 적용했을 때는, float:right 대신 margin-left:auto를 쓰자 Reference Making a flex item float right I have a Ignore par..
[CSS] div 내 child item 수평으로 가운데 정렬하는 방법 (vertical align) display:flex; align-items: center;

반응형