728x90 300x250 SMALL Front-end319 [크롬] 압축된 js 코드 예쁘게 보기 js 코드를 보다 보면 이렇게 압축된 코드가 있는데 이렇게 코드를 압축하면 용량도 적게 차지하고 더 빠르다고 한다. 그러나 보기가 불편하기 때문에 크롬에서는 이런 압축 코드를 예쁘게 보는 기능을 제공하고 있다. 개발자 도구 > Sources탭에서 해당 js를 열고 하단 Pretty print 아이콘을 클릭한다. 그러면 아래와 같이 코드가 보기 편하게 변경된 것을 확인할 수 있다. 2022. 4. 4. 온라인 소스코드 비교 사이트 Diffchecker https://www.diffchecker.com/ Diffchecker Try our desktop app Offline diffing, advanced features and more www.diffchecker.com Original Text에 원래 문서를 넣고 Changed Text에 변경된 문서를 넣고 Find Difference를 클릭하면 다른점을 찾아준다. 2022. 4. 2. 크롬 개발자 도구 :: 전체 검색 js 위치 찾기 크롬에서 클래스나 ID값을 검색했을 경우 해당 페이지뿐만 아니고 사이트 전체에서 검색하는 기능 1. F12키를 눌러 개발자 모드로 들어간 후에 왼쪽 상단에 Settings버튼 클릭 2. Preferences > Sources > Search in anonymous and content scripts 체크 3. 개발자 도구가 켜진 상태에서 Ctrl + Shift + F ( 맥에서는 Command + Option + F ) 검색창이 생긴다. 4. 찾고자 하는 키워드를 입력하고 새로고침 아이콘을 클릭 해당 클래스를 사용하는 css는 물론 js까지 한번에 확인할 수 있다. 2022. 3. 31. 테이블 코딩 고정하기 가로 스크롤 만들기 일반적으로 width=100%의 테이블을 만들면 아래와 같이 창 크기에 맞춰서 줄어들게 되는데 만약 창 크기 값을 고정하고 싶다면 테이블에 아래와 같이 css를 넣어주면 지정된 td의 width 값을 기준으로 크기가 고정이 된다. table { table-layout: fixed; } 그런데 테이블 레이아웃을 고정할 경우 창크기가 작으면 가려져서 테이블 내용이 안 보이게 된다. 이럴 경우 테이블을 감싸고 있는 div에 스크롤을 주면 된다. .table-wrap { overflow-x: scroll; } 만약 세로로 넘칠경우 overflow-y:scroll; 둘 다 적용하려면 overflow:scroll; 그래서 아래와 같이 적용하면 테이블의 가로 값을 고정값으로 사용할 수 있다. See the Pen t.. 2022. 3. 25. 이전 1 ··· 33 34 35 36 37 38 39 ··· 80 다음 728x90 반응형 LIST
