MASIGNCLEAN101

Cách Lấy CSS Của 1 Trang Web Với Extension Snappy Snippet

GIỚI THIỆU

Cách lấy CSS của 1 trang web thì có rất nhiều từ thủ công cho đến sử dụng những công cụ hổ trợ như Chrome Devtools hay Firebug của trình duyệt firefox.

Đối với người thiết kế website, mỗi khi họ gặp một ý tưởng thiết kế mới lạ trên internet, họ luôn luôn tự hỏi rằng “làm thế nào mà họ có thể làm được như vậy?”, và họ sẽ ngay lập tức muốn học hỏi nó hay làm theo ý tưởng thiết kế kia. Vậy cách lấy CSS của 1 trang web là như thế nào? Hiện nay công cụ mà đơn giản, phổ biến và được nhiều người lựa chọn nhất vì sự tiện lợi của nó là Snappy Snippet.


CÁCH LẤY CSS CỦA 1 TRANG WEB VỚI EXTENSION SNAPPY SNIPPET


Snappy Snippet là một tiện ích của google Chrome giúp bạn sao chép những đoạn CSS mà bạn muốn học hỏi hay làm theo. Để làm được điều này bạn cần download Snappy Snippet

Sau khi cài đặt xong, bạn nhấn F12 ở website mà bạn muốn sao chép thì bạn sẽ trong thấy công cụ Snappy Snippet

Hình 1 : Công cụ Snappy Snippet khi cài đặt xong

Và dưới đây là hình ảnh của Snappy Snippet sau khi được cài đặc xong và mở lên. Chúng ta cùng bắt đầu xem ứng dụng này nhé.

Hình 2 : Hình ảnh Snappy Snippet khi mở lên

Đầu tiên bạn cần chọn phần muốn sao chép CSS và bấm vào “Create a snippet from inspected element” để công cụ này load.

Sau khi có kết quả các bạn có thể thấy rằng một cột sẽ chứa HTML và một cột chứa CSS. Bạn chỉ cần Copy phần CSS về là bạn có thế lấy CSS từ một trang web.



Hình 3 : Phần hiển thì CSS và HTML

CÀI ĐẶT PHẦN SETTING SNAPPY SNIPPET


Hình 4 : Phần setting của công cụ Snappy Snippet

Bạn có thể tuỳ chỉnh nhanh code CSS ở phần bên dưới của Snappy Snippet. Những phần cài đặt đó là :


  •  Chỉ giữ các thuộc tính viết tắt (ví dụ: giữ "đường viền", nhưng bỏ "border-width")

  •  Xóa thuộc tính với giá trị trình duyệt mặc định

  •  Xóa các thuộc tính bắt đầu bằng "-webkit"

  •  Kết hợp cùng một quy tắc với nhau

  •  Định dạng và làm sạch HTML

  •  Bao gồm các phần tử đầu trong đoạn mã

  •  Đặt trước tất cả ID CSS

 Tuỳ vào từng trường hợp và mong muốn chỉnh sửa của bạn mà có nhưng cách khác nhau. 

Snappy Snippet là một công cụ vô cùng tiện lợi và cũng là cách lấy CSS của 1 trang web. Tuy nhiên, bạn hãy sử dụng công cụ này cho mục đích tham khảo và học tập của bạn. Những hành vi sao chép và sử dụng của người khác luôn được xem là phạm pháp, hơn nữa nếu phạm lạm dụng nó quá mức thì Snappy Snippet sẽ làm thui chột năng lực bản thân của bạn.

Vì thế hãy sử dụng đúng cách bạn nhé.
                                                                                                                       Nguồn: vidoco.vn

Share This :
Lò Bát Quái
avatar

Cos phải là lấy 1 css từ HTML bất kỳ đúng hân!???

19:47 15 tháng 7, 2018
avatar

Cái này f12 chỗ nào thì lấy CSS ở đó

19:57 15 tháng 7, 2018
avatar

Có cái nayuf mỗi lần đi ril temp ko cần phải mò nữa kiki

20:38 15 tháng 7, 2018
avatar

Ừ. Đơn giản hơn rất nhiều

21:03 15 tháng 7, 2018
avatar

ư ư ...như này là rip hết kakak

21:43 15 tháng 7, 2018
avatar

Há há, bài này hay :V

06:33 16 tháng 7, 2018
avatar

Phải nói là quá hay

08:43 16 tháng 7, 2018
avatar

hello :v buổi chiều vui vẻ

14:28 16 tháng 7, 2018
avatar

mà chẳng biết chủ blog này tên gì nữa , chẳng lẽ tên là Quai

15:04 16 tháng 7, 2018
avatar

No no no. Tên Quý nha

15:25 16 tháng 7, 2018
avatar

ư ư...hôm nào phải bảo bạn Quái chỉ vài chiêu mới được

16:20 16 tháng 7, 2018
avatar

ư ư, có biết rip temp đâu mà chỉ

17:00 16 tháng 7, 2018
avatar

Vẫn bình thường mà

17:00 16 tháng 7, 2018
avatar

Làm sai 1 vài bước í mà 😅😅 nên tưởng bị lỗi

10:41 17 tháng 7, 2018
avatar

Buổi Chiều vui vẻ nha :v

12:45 17 tháng 7, 2018
avatar

Ừ. Vừa xem xong 1 bộ phim

16:44 17 tháng 7, 2018
avatar

Nóng chứ, mát đâu

18:50 17 tháng 7, 2018
avatar

đã sửa lk, mà làm sao domain die rồi

20:23 17 tháng 7, 2018
avatar

https://www.leanhduc.xyz/2018/06/tut-tu-xat-acc-facebook-5s.html

10:46 19 tháng 7, 2018
avatar

Sửa liên kết cho tui đi
https://www.ngoctinhit.info/

17:26 19 tháng 7, 2018
avatar

sửa lk cho tui với nha: www.quocbaoblog.xyz

13:50 20 tháng 7, 2018
avatar

buổi chiều vui vẻ :D

16:49 21 tháng 7, 2018
avatar

I am star sinh
Bủi tối vv

20:20 21 tháng 7, 2018
avatar

chào buổi sáng nhan tiểu thư

07:17 22 tháng 7, 2018
avatar

https://www.leanhduc.xyz/2018/07/share-code-nhan-phan-biet-admin-va.html

qua ủng hộ e phát triển Blog Anh Đức nha <3

09:08 22 tháng 7, 2018
avatar

Quý ơi ! Theme này là Theme bên nước ngoài xong ông đem về Việt Hoá à

11:05 23 tháng 7, 2018
avatar

Hello anh yêu <3 Buổi tối vui vẻ nha <3

20:25 26 tháng 7, 2018