{"id":887,"date":"2022-02-03T15:45:09","date_gmt":"2022-02-03T06:45:09","guid":{"rendered":"http:\/\/mylittleforest.kr\/wordpress\/?p=887"},"modified":"2022-02-22T09:51:11","modified_gmt":"2022-02-22T00:51:11","slug":"css-%ea%b8%b0%ec%b4%88-%ed%99%9c%ec%9a%a9","status":"publish","type":"post","link":"http:\/\/mylittleforest.kr\/wordpress\/blog\/2022\/02\/03\/887\/","title":{"rendered":"CSS \uae30\ucd08 \ud65c\uc6a9"},"content":{"rendered":"\n

CSS \ud14c\ub450\ub9ac : CSS Border Style<\/a><\/h4>\n\n\n
\n<style>\np.dotted {border-style: dotted;}\np.dashed {border-style: dashed;}\np.solid {border-style: solid;}\n<\/style>\n...\n<p class="dotted">A dotted border.<\/p>\n<p class="dashed">A dashed border.<\/p>\n<p class="solid">A solid border.<\/p>\n<\/pre><\/div>\n\n\n
\ub192\uc774\uc640 \ub108\ube44 : CSS\u00a0Height and Width<\/a><\/h4>\n\n\n
\ndiv {\n  height: 200px;\n  width: 50%;\n  background-color: powderblue;\n}\n<\/pre><\/div>\n\n\n
CSS \uc5ec\ubc31 : CSS\u00a0Margin<\/a><\/h4>\n\n\n
\np {\n  margin-top: 100px;\n  margin-bottom: 100px;\n  margin-right: 150px;\n  margin-left: 80px;\n}\n<\/pre><\/div>\n\n\n
CSS \ubc15\uc2a4\ubaa8\ub378 : CSS\u00a0Box Model<\/a><\/h4>\n\n\n
\ndiv {\n  width: 300px;\n  border: 15px solid green;\n  padding: 50px;\n  margin: 20px;\n}\n<\/pre><\/div>\n\n\n
CSS \uc544\uc774\ucf58 \ubaa8\ub378 : CSS\u00a0Icons<\/a><\/h4>\n\n\n
\n<head>\n<script src="https:\/\/kit.fontawesome.com\/a076d05399.js" crossorigin="anonymous"><\/script>\n<\/head>\n\n<i class="fas fa-cloud"><\/i>\n<i class="fas fa-heart"><\/i>\n<i class="fas fa-cloud" style="font-size:24px;"><\/i>\n<i class="fas fa-cloud" style="font-size:36px;"><\/i>\n<\/pre><\/div>\n\n\n
CSS \uc624\ubc84\ud50c\ub85c \ubaa8\ub378 : CSS\u00a0Layout – Overflow<\/a><\/h4>\n\n\n
\ndiv {\n  width: 200px;\n  height: 50px;\n  background-color: #eee;\n  overflow: visible;\n}\n<\/pre><\/div>\n\n\n
CSS \uac00\uc0c1\ud074\ub798\uc2a4 : <\/h4>\n\n\n\n
CSS\u00a0Links<\/a><\/p>\n\n\n
\n\/* unvisited link *\/\na:link {\n  color: red;\n}\n\n\/* visited link *\/\na:visited {\n  color: green;\n}\n\n\/* mouse over link *\/\na:hover {\n  color: hotpink;\n}\n\n\/* selected link *\/\na:active {\n  color: blue;\n}\n<\/pre><\/div>\n\n\n
CSS\u00a0Dropdowns<\/a><\/p>\n\n\n
\n<style>\n.dropdown {\n  position: relative;\n  display: inline-block;\n}\n\n.dropdown-content {\n  display: none;\n  position: absolute;\n  background-color: #f9f9f9;\n  min-width: 160px;\n  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);\n  padding: 12px 16px;\n  z-index: 1;\n}\n\n.dropdown:hover .dropdown-content {\n  display: block;\n}\n<\/style>\n\n<div class="dropdown">\n  <span>Mouse over me<\/span>\n  <div class="dropdown-content">\n    <p>Hello World!<\/p>\n  <\/div>\n<\/div>\n<\/pre><\/div>\n\n\n

<\/p>\n","protected":false},"excerpt":{"rendered":"
CSS \ud14c\ub450\ub9ac : CSS Border Style \ub192\uc774\uc640 \ub108\ube44 : CSS\u00a0Height and Width CSS \uc5ec\ubc31 : CSS\u00a0Margin CSS \ubc15\uc2a4\ubaa8\ub378 : CSS\u00a0Box Model CSS \uc544\uc774\ucf58 \ubaa8\ub378 : CSS\u00a0Icons CSS \uc624\ubc84\ud50c\ub85c \ubaa8\ub378 : CSS\u00a0Layout – Overflow CSS \uac00\uc0c1\ud074\ub798\uc2a4 : CSS\u00a0Links CSS\u00a0Dropdowns<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false},"categories":[38],"tags":[],"_links":{"self":[{"href":"http:\/\/mylittleforest.kr\/wordpress\/wp-json\/wp\/v2\/posts\/887"}],"collection":[{"href":"http:\/\/mylittleforest.kr\/wordpress\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"http:\/\/mylittleforest.kr\/wordpress\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"http:\/\/mylittleforest.kr\/wordpress\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"http:\/\/mylittleforest.kr\/wordpress\/wp-json\/wp\/v2\/comments?post=887"}],"version-history":[{"count":11,"href":"http:\/\/mylittleforest.kr\/wordpress\/wp-json\/wp\/v2\/posts\/887\/revisions"}],"predecessor-version":[{"id":898,"href":"http:\/\/mylittleforest.kr\/wordpress\/wp-json\/wp\/v2\/posts\/887\/revisions\/898"}],"wp:attachment":[{"href":"http:\/\/mylittleforest.kr\/wordpress\/wp-json\/wp\/v2\/media?parent=887"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"http:\/\/mylittleforest.kr\/wordpress\/wp-json\/wp\/v2\/categories?post=887"},{"taxonomy":"post_tag","embeddable":true,"href":"http:\/\/mylittleforest.kr\/wordpress\/wp-json\/wp\/v2\/tags?post=887"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}