테스트 사이트 - 개발 중인 베타 버전입니다

vscode 자동완성 관련해서 잘아시는분 있으실까요?ㅠㅠ

· 2년 전 · 1664 · 8

이것저것 찾아보긴했는데 제가 예전에 썼던게 없는 것 같아서 ㅠㅠ

 

class 입력 후 엔터를 치면 class="" 가 바로 완성되고

img src 태그에서 img/ 입력하면 이미지 경로를 알아서 찾아주는 그런게 있었던거같은데 

 

혹시 아시는분이 있으실가요?

 

-------------------------------------------

자답입니다! 답글 달아주신분들 감사드립니다!!

 

  1. "Preferences" > "Configure User Snippets"를 선택합니다.
  2. "html.json" 을 선택합니다
  3. { } 안에 아래 내용을 붙여넣습니다
  4. "class attribute": {

            "prefix": "class",

            "body": [

              "class=\"$1\""

            ],

            "description": "Add class attribute with empty value"

          }

  5. 코딩할 페이지로 돌아가서 <div class 엔터를 하면 ="" 가 붙습니다..ㅋㅋㅋㅋㅋㅋ

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 8개

베스트 댓글

2년 전 BEST
잘은모르지만

HTML CSS SUPPORT
https://marketplace.visualstudio.com/items?itemName=ecmel.vscode-html-css

요거아닐까요?
원댓글 보기 →
2년 전 BEST
@하틴 글쿤요... 찾으시던게 아니라 안타깝네요. 찾던것 꼭 찾으시길 바래요~
원댓글 보기 →
예전엔 zen coding이라 부르다가 지금은 emmet 이라 부르는 녀석인데용
.탭 을 하면 클래스가 빈 div가 생기구요
li*5탭을 하면 li가 5개 생기고 이런 녀석이죠...
원댓글 보기 →
2년 전
잘은모르지만

HTML CSS SUPPORT
https://marketplace.visualstudio.com/items?itemName=ecmel.vscode-html-css

요거아닐까요?
@정적인손님 제가 찾던건 아니지만 감사합니다!ㅎㅎ
2년 전
@하틴 글쿤요... 찾으시던게 아니라 안타깝네요. 찾던것 꼭 찾으시길 바래요~
html 파일에서는 기본적으로 제공하는 기능입니다.

예를 들어

.엔터 > <div class=""></div>
p엔터 <p></p>
@미니님a 오오 감사합니다!
예전엔 zen coding이라 부르다가 지금은 emmet 이라 부르는 녀석인데용
.탭 을 하면 클래스가 빈 div가 생기구요
li*5탭을 하면 li가 5개 생기고 이런 녀석이죠...
@PWneo 아~~~ 네 이런거였는데 감사합니다! ㅎㅎ
div>ul>li*5 를 하면 div안에 ul 안에 li를 5개 만들어주고... 손에 익으면 편합니다 ㅎㅎ

게시글 목록

번호 제목
1717629
1717626
1717625
1717621
1717619
1717611
1717610
1717609
1717607
1717601
1717598
1717591
1717590
1717583
1717575
1717572
1717568
1717566
1717549
1717545
1717533
1717512
1717511
1717508
1717495
1717479
1717473
1717470
1717463
1717452