Outputor

span 태그는 text-align 적용이 안되므로 display: inline-block; 지정 후 text-align: right 적용함 차트 라이브러리 https://www.chartjs.org/ Chart.js | Open source HTML5 Charts for your website New in 2.0 New chart axis types Plot complex, sparse datasets on date time, logarithmic or even entirely custom scales with ease. www.chartjs.org 더보기 더보기 HTML home house Services headphones Alerts flag Stats stacked_bar_chart search..

더보기 더보기 더보기 HTML 나이키 아디다스 반스 참 잘했어요. 앞으로도 계속 잘부탁합니다 이정도면 괜찮아요. 조금 더 발전하면 좋겠습니다 너무 부족하네요. 이러면 같이 가기 힘들어요 1 of 2 2 of 2 1 of 3 2 of 3 3 of 3 더보기 더보기 더보기 SCSS // LIST @mixin list () { border: 1px solid #e9ecef; padding: 10px 0px 10px 10px; font-size: 20px; } @mixin active () { background-color: #1c7ed6; color: #fff; } ul { list-style: none; margin: 0; padding: 10px; .list { @include list(); } .list..

@mixin 1. 스타일 여러줄을 한 단어로 치환해서 사용가능함 2. 형태: @mixin 이름 ( ){ 스타일 } 3. @mixin을 사용하려면 @include 이름( )을 작성해주면 됨 4. @mixin 이름 ( $bgColor ) { background-color: $bgColor } 이렇게 함수처럼 사용가능함 @mixin box-style ($bgColor) { width: 150px; height: 100px; margin:auto; margin-top: 20px; background-color: $bgColor; } .box { @include box-style(blue); } 5. @mixin 이름 ( $bg ) { #{bg}: blue } 처럼 스타일 이름에도 사용가능함 @mixin box-..

SASS와 SCSS 1. SASS와 SCSS 차이: SASS는 코드짤 때 중괄호 생략이 가능하고 SCSS는 중괄호 생략이 안됨 클래스를 확장하는 @extend 1. %를 사용해서 이름을 적어주면 파일 자체에서 적용되지 않고 @extend를 해줘야만 적용됨 2. 기존 클래스도 @extend 가능함 3. @extend를 사용한 후 복사할 클래스명을 뒤에 적으면 클래스명에 있던 모든 내용이 복사됨 셀렉터 대신 쓰는 Nesting 1. .box p { } 이렇게 쓰는 대신 아래처럼 사용 가능함 ⬇ 2. hover를 사용할 때 &를 쓰지않으면 h3 :hover처럼 뛰어서 작성되어 작동안됨 더보기 더보기 HTML Sass Sass Sass Sass 더보기 더보기 SCSS $bg-color: #f06595; $fon..