CSS를 배워보자 4. 선택자의 우선순위 CSS는 중복선언을 허용한다. 중복되는 속성이 있을경우 아래와 같은 우선순위로 처리된다. ①. 속성값 뒤에 !important 를 붙인 속성 ②. HTML에서 style을 직접 지정한 속성 ③. #id 로 지정한 속성 ④. .클래스, :추상클래스 로 지정한 속성 ⑤. 요소이름으로 지정한 속성 ⑥. 상속된 속성 같은 우선순위에 있는 경우, 나중에 선언된 것이 우선되어 적용된다. 5. 명시도 계산법 !important > id [ 100 ] > class [ 10 ] > tag [ 1 ] > * [ 0 ] ID 선택자의 갯수를 세어서 개당 100 으로 계산한다. 클래스 선택자의 갯수를 세어서 개당 10 으로 계산한다. 태그 선택자의 갯수를 세어서 개당 1 로 계산한다..

CSS를 배워보자 1. CSS란? Cascading Style Sheets 라고하며, HTML과 같은 마크업 언어들이 실제 표시되는 방법을 기술하는 언어이다. W3C의 표준이며 레이아웃과 스타일을 정의할 때 주로 쓴다. 마크업 언어가 몸체를 이룬다면 CSS는 그것을 꾸며주는 역할을 하는 것이다. 2. 선언방식 공백은 W3C 표준에서 들여쓰기는 스페이스 2칸을 권장하고 있다. 각 선택자간에는 한줄의 여백을 권장한다. 선언방식으로는 ①. in-line: 태그안에서 속성으로 추가. ②. internal: head안에 넣어서 선언 ③. external: head안에 링크넣어서 선언 3. 선택자 보기 쉽게 표로 만들어보았다 선택자 선택자명 설명 * 전체 선택자 모든 요소를 선택한다 #id ID 선택자 id값이 같..

개발기술에는 다양한 분야가 있다. 먼저, 프론트엔드는 앞단으로 주로 백엔드에서 json형태로 뱉으면 그걸받아서 클라이언트단에 뿌려주는 역할을 한다. HTML / HTML5: Semantic web CSS / CSS3: LESS, SASS, Media Queries JavaScript: jQuery, AngularJS, Knockout, etc. Compatibility quirks across browsers Responsive design AJAX, JSON, XML, WebSocket 백엔드는 서버단이라고 하며, 주로 json으로 만들어 뱉는 거까지 한다. 프론트엔드와 협업할때, 주소를 알려주면 된다 Web servers: Apache, Nginx Programming language: PHP, Ja..

폼의 양식 보통 요즘은 fieldset 테두리도 지우고, legend의 글자도 css로 없애는 편입니다 fieldset legend 버튼 : button | input 기능은 같지만, button에는 내부에 아이콘도 넣을 수 있고, 태그도 집어넣을 수 있기 때문에 디자인적인 면에서 많이 사용하는 편이다. 전송 한 줄 문자입력 : input label - for 속성과 input - id, name 속성을 동일하게 입력해야 합니다. input 태그가 가지는 대표적인 속성 1) disabled = "disabled" 2) placeholder = "입력 힌트 문장" 3) autofocus="autofocus" : 처음에 어디에 포커스를 둘지 설정 4) required="required" : 필수입력항목 지정..

자주 사용하는 기호 문장을 강조 맛있었다 20,000원이다 피자를 먹었다 단어의 정의 세계무역기구 세계무역기구 용어의 축약 WTO WTO 노래, 영화, 그림 등의 제목 다음은 소설 대도시의 사랑법의 한 부분입니다. 앞에있는 내용의 부가설명 가격 : 200,000원 (부가세 별도) 가격 : 200,000원 (부가세 별도) 루비주석 Hello안녕 Hello안녕 水수魚어之지交교 水수 魚어 之지 交교 시간 오늘은 일요일입니다 2000년 01월 01일에 나무를 심었습니다 제목 h1~h6 태그 안에는 p 태그가 들어갈 수 없습니다 제목 제목 제목 제목 제목 제목 단락 p 태그 안에는 h1~h6 태그가 들어갈 수 없습니다 Lorem Ipsum is simply dummy text of the printing and ..

HTML 항상 이런형태로 구간을 나눈 다음 html 코드를 작성하는 것을 추천합니다. 다른 형태의 구조가 필요할 때도 있지만 처음 접하거나, 공부하는 입장에서는 특정 형식을 따라가는것이 더 안정감있게 코드를 작성할 수 있습니다 레이아웃 출처 : know-one-by-one.tistory.com/19

Notepad++로 HTML을 코딩할 때 불편한 사항이 있으셨을 겁니다. 왜 코드 정렬을 우리가 해줘야 하는가. 이클립스에서는 Ctrl+Shift+F (Source->Format)로 코드 자동정렬이 가능하고 안드로이드 스튜디오 등 IDEA에서는 Alt+Shift+L (Reformat code)로, 비주얼 스튜디오에서는 Ctrl+K와 Ctrl+D를 순서대로 빠르게 눌러 문서 전체의 코드 자동 정렬이 가능한데 왜 Notepad++는 그게 안되는가 아쉬워하셨을 분들에게 소개합니다. XML Tools 플러그인 XML Tools 플러그인은 libXML2 기반으로 XML 문법 검사, XML 스키마 + DTD 검증, 태그 자동 닫기, 코드 자동 정렬 등을 제공합니다. 우리에게 필요한 기능이 있군요. 설치하려면 Plu..