18.03.18시작

***일단 구조는 -------------------내용... 더보기------------------- ***참고로 ... 효과가 텍스트 중간에 오는 경우가 있는데 font-family 에 영향을 받기에 그런거임. dotum 으로 하면 중간에 생성됨. ***그냥 간단하게 원리위주로 설명한다면 1.내용 에 width 값을 고정적으로 주기 (더보기 가 고정) 2. 내용 에 max-width 값으로 고정적으로 주기 (더보기 가 같이 줄어듬) 3.더보기 에 float:right 사용하고 더보기 를 앞에 두기 (단, float:left 는 안됨) 4.nth-last-of-type 과 max-width 방법 예를들어,-------------------내용 = nth-last-of-type(2) {max-width:..

***--------------------| | || | |-------------------- 이런식으로 보더값이 하나하나 박스에 들어가있는게 아니라 하나의 border 를 공유하고 있는 구조일때 만드는방법 ***방법이야 여러가지겠지만 원리위주로 2개만 적어봄. ***참고로 active 는 hover 나 선택되었을때 효과를 의미함. ***방법 하나 1. li 마다 border 값을 줌 2. li 두번째꺼부터 margin-left:-1px 씩 줌. 여기까지하면 정상적으로 보이나 왼쪽 border 가 다음 li 에 가려서 안보이는 문제가 있음 3. li 에 position:relative; z-index:1; 를 줌. 4. active 시에 z-index:2; 를 줌. ***방법 둘 1. li 마다 bor..

Lorem ipsum dolor sit amet, consectetur adipisicing elit. 2014-08-30 Lorem ipsum dolr adipisicing elit. Neque nihil! 2014-09-03 ***키포인트는 width 값을 고정적으로 주지 않아도 말줄임효과가 표현이 됨. 가리는 행위를 하는 자식을 position:absolute 로 띄어주고 그 부모에다 padding 값으로 자식의 크기만큼 주면 됨.

***일단 쉽게 3개로 나뉘어지는거 같음. 1. user agent stylesheet = 사용자 도구 스타일시트 = 웹브라우저마다 기본적으로 정해놓은 거 2. user defined stylesheet = 사용자 정의 스타일 시트 = 사용자 입장에서 제작자의 css 를 수정(?)하는 행위 자체인듯?예를 들어, 크롬 개발자도구에서 수정하는거. 3. author defined stylesheet = 제작자 정의 스타일 시트 = 제작자가 external 이든 internal 이든 inine 이든 뭐든간에 만든 css.웹사이트의 기본을 구성하는 css ***이거는 w3.org 에 따른거임 1. user agent 2. user normal 3. author normal 4. author important 5...