前台网页的元素是通过CSS样式展现的,前端开发者可以通过工具对网页上的CSS进行查看或调试。
公司主营业务:做网站、网站建设、移动网站开发等业务。帮助企业客户真正实现互联网宣传,提高企业的竞争能力。创新互联公司是一支青春激扬、勤奋敬业、活力青春激扬、勤奋敬业、活力澎湃、和谐高效的团队。公司秉承以“开放、自由、严谨、自律”为核心的企业文化,感谢他们对我们的高要求,感谢他们从不同领域给我们带来的挑战,让我们激情的团队有机会用头脑与智慧不断的给客户带来惊喜。创新互联公司推出兴安免费做网站回馈大家。
推荐使用谷歌浏览器或火狐浏览器,这两种浏览器有强大的控制台,都是前端开发者必备的调试工具之一。
下面以谷歌Chrome浏览器为例(火狐浏览器类似):
一、按组合快捷键 Ctrl+Shift+C
如上图,在当前页面按组合键Ctrl+Shift+C,然后鼠标移到被查看的元素上,元素被置为可审查的状态。
二、单击被审查的元素
如上图,当前元素的CSS样式在控制台右侧都列出来了。
可以通过编辑右侧的CSS属性,对页面的展现样式作调试,很方便。
更快捷的方法:
接下来的步骤和上面的一致。
CSS分两种,一种就是调用,这一般都在头部head/head之间有调用代码,另一种就是网页内部控制,要想看得很清楚我到是可以推荐你用“谷歌浏览器”查看,比较方便,清楚!下面我给你示范了下,就是我给你回答的这个页面的CSS查看!
下面那个放大镜是查看按钮,点击后再点页面你要查看的地方,然后就会出现在右边了,具体打开是右键---审查元素,或者Ctrl+Shift+i快捷打开!
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样式
1、在浏览器中打开要调试的网页,使用快捷键F12。
2、在弹出的工具窗口中,默认是在Dom Explorer功能,列出网页的源代码和CSS样式列表。
3、使用元素定位功能选择页面中的一个元素同时也定位到源代码中位置,比如百度首页的"网页"元素。
4、对定位到的文字修改CSS样式,添加inline style,比如把字体变红色。也可以手工修改其他已经存在的样式。
5、查看元素已经应到到的CSS样式,点击"computed"菜单。
6、查看元素的布局信息,点击"Layout"菜单。
要查看一个网站使用了什么css代码,可以通过在网站空白处右键,选择查看源代码,一般来说css代码有三种引入形式,第一种是直接在标签后面加style属性,比如div style="width=...; height=...; "/div;第二种是写在style标签内部;第三种是通过link标签引入,引入文件的后缀一般是.css,如果是link的引入方式,直接在源文件上点击链接即可看到了。
除了以上办法查看网站的css代码,还可以通过按f12键,调出开发者模式,这种方法可以快速的查到网页上某个元素具体有什么css样式。因为不同浏览器的开发者模式不一样,这里就不展开说明了。
以上办法基本上可以得到网站的css代码,当然,如果网站是通过js动态引入或者修改css样式,这就得费较大一番功夫了。
按照你的问题应该是添加样式后没有反应
首页 可以给你的html添加 行内样式:如p style="font-size:24px;"/p
其次可以在页面中也如样式如:
style
p{ font-size:24px}
/style
3. 可以引入外部样式:link href="style.css" rel="stylesheet" type="text/css" / 意思就是创建一个 名字叫style的CSS文件 并用 link标签引入