今天就学习课程吧!
今天就开通帐号,24,700 门业界名师课程任您挑!
Debugging with developer tools
- [Instructor] Some elements have default margin and padding styles, which can make it hard to tell where the space is coming from. To identify the source, we can use the built-in browser developer tools to inspect the element. Let's go over an example. If you'd like to follow along, open the box-model.html page in your browser. It can be found in the exercise files, in chapter three, video 03_06. I'll be using Firefox and Chrome for this demo, but the developer tools in other browsers will have similar functionality. I'll start with Firefox. To inspect an element and open the dev tools, hover over an element with your mouse or track pad. Let's go with Heading 1. Then, right-click or use a two finger tap to open the menu and select Inspect or Inspect Element. A panel will open showing the page's HTML and the corresponding CSS. My h1 is highlighted, since that's the element I inspected, but if you weren't able…
随堂练习,边学边练
下载课堂讲义。学练结合,紧跟进度,轻松巩固知识。
内容
-
-
-
-
-
Intro to the CSS box model58 秒
-
(已锁定)
The box model properties3 分钟 44 秒
-
(已锁定)
Box-sizing and the box model fix4 分钟 23 秒
-
(已锁定)
Inline, block, and display4 分钟 39 秒
-
(已锁定)
Project: Footer styles and icons4 分钟 4 秒
-
(已锁定)
Debugging with developer tools5 分钟 6 秒
-
(已锁定)
Managing box model quirks4 分钟 2 秒
-
(已锁定)
Project: Background image update3 分钟 23 秒
-
(已锁定)
Using negative margin values2 分钟 42 秒
-
(已锁定)
Center aligning with margin3 分钟 42 秒
-
(已锁定)
Project: Adding content wrappers4 分钟 44 秒
-
(已锁定)
Project: Adding a header image5 分钟 56 秒
-
-
-
-
-
-