다루한의 코딩공부

@media ( max-width: 768px ) {      body {           color: red;      } } <meta name="viewport" content="width=device-width, initial-scale=1">

Javascript $(document).ready(function () {      /* html 외부 파일 불러오기 */      $("nav").load("/common/menu/menu.html");      $("footer").load("/common/footer/footer.html");      $('html').scrollTop(0); });

CSS  <style type="text/css">     @import url("/css/stylesheet.css"); </style>

HTML < div class = "slide" > < div class = "wrapper slide-wrapper" > < ul class = "slide-item slide-slides" > < li class = "slide-slide slide-slide-container background-image" style = " background-image: url('/images/slide/bridge-2805540.jpg');background-position: 50% 50%;" > < div class = "item content background-content-black" > < div class = "subhead" style = " color:white;" > [로고] </ div > < div class = "subhead" style = " color:white;" > 청와대 대한민국 ESG 협약한 기술로 인정받은 ESG 경영 문구 </ div > < div class = "subhead" style = " color:white;" > 42번째 정부기관과 협약한 회사 </ div > < div class = "subhead" style = " color:white;" > (태양광 가로등 사진 전후면) </ div

CSS a {      text-decoration: none; }

CSS * {      -webkit-font-smoothing: antialiased; }

참고 사이트 :  https://naradesign.github.io/flex-justify-align.html 참고 사이트 :  https://studiomeal.com/archives/197

CSS ul {      list-style-type: none; }

home.html <div id="menu"></div> home.js $(document).ready(function () {      $("#menu").load("common/menu/menu.html"); });   menu.html <h1>menu</h1>

 object-fit: fill | contain | cover | none | scale-down fill :  cover :  none :  scale-down :  참고 사이트 : 

 참고 사이트 :  https://www.freecodecamp.org/korean/news/cssro-mueosideun-jungang-jeongryeolhaneun-bangbeob-div-tegseuteu-deung/

 "abcde".replace("abc",""); // "de" "abc".charAt(0); // "a"

 .class, .id { } 참고 사이트 :  https://ofcourse.kr/css-course/%EB%8B%A4%EC%A4%91-%EC%A1%B0%EA%B1%B4-%EC%84%A0%ED%83%9D%EC%9E%90

자손 결합자 .parent .child {     // parent 노드의 자손(parent 내부의 모든 .child 노드)인 .child 노드 속성 적용 } 자식 결합자 .parent > .child {     // parent 노드의 자식(바로 아래 노드 선택)인 .child 노드 속성 적용 } 일반 형제 결합자 .brother ~ .sister {     // .brother 노드의 형제(옆의 노드 선택)인 .sister 노드 속성 적용 } 인접 형제 결합자 .brother + .sister {     // .brother 노드의 바로 옆인 형제(바로 옆의 노드 선택)인 .sister 노드 속성 적용 } 참고 사이트 :  https://joooohee.tistory.com/52

CSS, Javascript 파일 연결 안될시 참고 사이트 :  https://okky.kr/questions/178851 - 컨트롤러 RequestMapping("/")를 RequestMapping("")으로 변경

Shift + Tab : 툴팁 Tab : 자동완성 보기

참고 사이트 :  https://rgy0409.tistory.com/4678 <main>     <aside></aside>     <section></section> </main> #wrap2 {      font-size: 0;      letter-spacing: 0;      word-spacing: 0; }

  <header> </header> <nav></nav> <aside> </aside> <main>     <article>     </article>     <section>     </section> </main> <footer></footer>