怎样在F12下查看源码和调试网页CSS

html-css06

怎样在F12下查看源码和调试网页CSS,第1张

怎样在F12下查看源码和调试网页CSS?下面我们就来看一下具体是如何操作的吧。

01

首先我们需要打开一个网页,然后按F12开始查看源码。

02

调出代码之后,然后选择你想修改网站框架的地方。

03

在最右边的一块代码中就是属于网页的CSS样式表,然后我们鼠标放在上面,就会在代码前面出现一个√号框。

04

双击你想修改的CSS代码,然后输入你想修改的值,修改成功之后我们就可以看到网页发生改变。

查看源代码,找到代码中倒入样式表文件那段代码,可以直接找到相关路径并下载样式表css文件;

1.在网站页面上单机鼠标右键,点击查看源代码;

2.然后在源代码中就会发现类似于下面这样的代码,一般是在最上面<head>标签里面:

<link rel="stylesheet" type="text/css" href="../style.css" />

3.href后面的.css文件就是你要的样式表文件;

4.把href中的文件前面加上网页路径,如:http://www.XXXX.com/css/style.css,粘贴到迅雷中进行下载,下载下来就可以通过编辑工具进行相关的修改了。

<link href="/css/article.css" rel="stylesheet" type="text/css" />

<link href="/css/base.css" rel="stylesheet" type="text/css" /

正常 在head标签里面 有这样的 代码 表示调用这些/css/base.css 在这路径前面加他的网址 就可以看到他的css样式