fast campus / HTML-CSS
2분 read (About 225 words)

2019-04-12 TIL

인기 사이트

image

마크업

내 마크업

1
2
3
4
5
6
7
section.favorite
    h2.favorite-heading
    ol.favorite-list
        li
            a
            strong            
    a.favorite-more

강사님 마크업
1
2
3
4
5
6
7
section.favorite
    h2.favorite=heading
    ol
        li.no1
            a
            em.up, em.down, em.stop
    favorite-more

인용구

image

인용구 tag

1
2
<q></q>
<blockquote></blockquote>

마크업

1
2
3
4
article.web-cafe
    h2
    p
    footer

article에 footer를 숨김영역으로 하여 내용을 복사 할 때 같이 복사가 됨

html

1
2
3
4
5
6
7
8
9
<article class="slogan">
    <h2 class="slogan-heading" title="웹카페에서 웹표준을">슬로건</h2>
    <p class="slogan-content">
        <q site="http://w3.org">The power of the Web is in its universality, Access by everyone regardless of disability is an essential aspect." Tim Berners - Lee , W3C Director and inventor of the World Wide Web</q>
        <footer class="readable-hidden">
            출처 : Worl Wide Web Consortium
        </footer>
    </p>
</article>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
.slogan{    
    position: relative;
    padding:10px 70px 10px 180px;
}
.slogan-heading{           
    width: 110px;
    height: 83px;
    line-height: 83px;
    text-align: center;
    position: absolute;
    left: 35px;
    bottom: -35px;
}   
.slogan-heading::after{
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: url("./images/coffee.png") no-repeat;
}
.slogan-content{
    color: #a09784;
}
.slogan-content q::before{
    content: '"';
    font-size: 3rem;
    position: relative;
    top:10px;
}
# ,
2019-04-15 TIL
2019-04-11 TIL

최근 글

팔로우

링크

카테고리

태그 클라우드

Babel Bootstrap Constructor DOM Data type Definition ESMAScript Error Expression Function Global HTML-CSS JQuery Javascript Lexocal Scope Literal Object Primitive Scope TIL TypeError VSCode Webpack angular aws call by reference call by value codility coding css ec2 eslint express github homework html http https javascript lambda mongodb oh-my-posh password project putty react redirect regex shell sort study this validation var web-basic windows zsh 환경

아카이브

태그

Babel 1
Bootstrap 1
Constructor 1
DOM 1
Data type 1
Definition 1
ESMAScript 1
Error 1
Expression 1
Function 1
Global 1
HTML-CSS 11
JQuery 1
Javascript 7
Lexocal Scope 1
Literal 1
Object 1
Primitive 1
Scope 1
TIL 10
TypeError 1
VSCode 1
Webpack 1
angular 2
aws 6
call by reference 1
call by value 1
codility 5
coding 6
css 1
ec2 6
eslint 1
express 1
github 1
homework 1
html 1
http 1
https 1
javascript 1
lambda 2
mongodb 1
oh-my-posh 1
password 1
project 1
putty 4
react 1
redirect 1
regex 1
shell 1
sort 1
study 7
this 1
validation 1
var 1
web-basic 2
windows 1
zsh 1
환경 2
팔로우

링크

카테고리

태그 클라우드

Babel Bootstrap Constructor DOM Data type Definition ESMAScript Error Expression Function Global HTML-CSS JQuery Javascript Lexocal Scope Literal Object Primitive Scope TIL TypeError VSCode Webpack angular aws call by reference call by value codility coding css ec2 eslint express github homework html http https javascript lambda mongodb oh-my-posh password project putty react redirect regex shell sort study this validation var web-basic windows zsh 환경

아카이브

태그

Babel 1
Bootstrap 1
Constructor 1
DOM 1
Data type 1
Definition 1
ESMAScript 1
Error 1
Expression 1
Function 1
Global 1
HTML-CSS 11
JQuery 1
Javascript 7
Lexocal Scope 1
Literal 1
Object 1
Primitive 1
Scope 1
TIL 10
TypeError 1
VSCode 1
Webpack 1
angular 2
aws 6
call by reference 1
call by value 1
codility 5
coding 6
css 1
ec2 6
eslint 1
express 1
github 1
homework 1
html 1
http 1
https 1
javascript 1
lambda 2
mongodb 1
oh-my-posh 1
password 1
project 1
putty 4
react 1
redirect 1
regex 1
shell 1
sort 1
study 7
this 1
validation 1
var 1
web-basic 2
windows 1
zsh 1
환경 2
Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×