Inspect & Debugging CSS Chrome Dev Tools | CSS in Hindi - 5

Опубликовано: 22 Февраль 2020
на канале: Coder Dost
3,258
39

Use the Styles tab: In the devtools, go to the "Elements" tab and select an element. The "Styles" tab will show you all the CSS styles that are applied to the element, and you can make changes to the CSS in real-time to see how it affects the element.

*** External Links ***

🎯 Chrome developer tools Inspect element - http://bit.ly/HTMLinHindi_ChromeDevel...




🔴 Full Courses List : https://coderdost.com/courses
🔴 Full Projects List : https://coderdost.com/projects

💾 Source Codes at : https://github.com/coderdost


🤯 Crash Courses (Single Video)

Git/Github Crash Course : https://bit.ly/3JSA5VT
TypeScript Crash Course : https://bit.ly/372dZSh
Angular Crash Course : https://bit.ly/3DoGJR1
Vue JS Crash Course : https://bit.ly/3uDujRl
Python Crash Course : https://bit.ly/3Dod7U2
React Router Crash Course : https://bit.ly/36YfO2i


🧑‍🏫 Tutorial Playlists

HTML : https://bit.ly/36IMq0h
CSS : https://bit.ly/3LpRQw6
JavaScript : https://bit.ly/3u049tf
BootStrap : https://bit.ly/3NA9nDJ
ES 6 : https://bit.ly/3DvYCh6
DOM Playlist : https://bit.ly/35nMKB7
ReactJS (Redux & Hooks) : https://bit.ly/3iMethN
NodeJS/ExpressJS : https://bit.ly/35nN6Yt
MongoDB / Mongoose : https://bit.ly/3qPj0EO


💻 Projects Playlists

Web Design HTML+CSS - Home Page : https://bit.ly/35nZiIB
Web Design BootStrap - E-Commerce Site : https://bit.ly/3iPhaz7
React/Redux/Firebase - Todo-App : https://bit.ly/3DnekL8


🕹 Mini Projects (Single Video)

React - Tic Tac Toe (Redux / Hooks) : https://bit.ly/3uzLEuy
React - Game of Flag Quiz (Hooks) : https://bit.ly/3LpTC0e
React - Google Translate Clone (Hooks) : https://bit.ly/3Lo9xvZ
React - Chat App using Firebase (Hooks) : https://bit.ly/3wLgymj


*Music Credits*

Funk Game Loop by Kevin MacLeod is licensed under a Creative Commons Attribution license (https://creativecommons.org/licenses/...)
Source: http://incompetech.com/music/royalty-...
Artist: http://incompetech.com/




















































































***Highlights of the video***


We begin this CSS tutorial by performing Inspect CSS using Google Chrome Dev Tools We also try debugging CSS using Google Chrome Developer Tools for CSS. We can edit CSS realtime using Google Chrome Developer Tools. We can modify and change CSS live using Google Chrome Developer Tools.

This video shows how we use inspect element of Google Chrome dev tools for css and How is it helpful to edit web pages using inspect element in a browser. We can Change CSS Live and Edit CSS Live by using chrome to modify CSS in browser. We also see How to Use the Chrome Document Inspector to Change CSS Values live and in real time.




In order to learn css, we need to write css code. CSS is abbreviation for cascading style sheets. We write css code separately which can be used for various html elements in html.


This video is part of our series “Css in hindi”. This set of videos explain css tutorial in hindi. With the “Css tutorial Hindi” we try to explain Css in hind. This content is created with the help of Youstart, Jaipur.