css放在html里面和外面显示不同

guoguoxiaotian 2018-05-31 09:41:41

刚碰到一个显示问题，先贴代码

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

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



</head>

<body>

 <div id="banner">

    <div id="logo">

        学习

    </div>

    <div id="wel">欢迎你：

</div>



</div>

</body>

</html>

#banner{

    

    width: 70%;

    margin:auto;

    height: 100px;

    background-color: #f6f9fa;

}

#logo{

    width:30%;

    margin:auto;

    background-color:red;

   

}

#wel{

    float: right;

    font-size: 9pt;

    background-color:blue;



}

显示效果

如果css放在head里面显示会不一样

这就有点奇怪,希望大佬能帮忙解决一下

...全文

1421 14 打赏收藏转发到动态举报

写回复

14 条回复

切换为时间正序

请发表友善的回复…

发表回复

guoguoxiaotian 2018-06-08

打赏
举报

回复

结果：css中第一个样式不使用，在开头添加了,然后再次显示就正常，删去之后清除缓存，再次显示还是正常。

伟洪winni 2018-06-06

打赏
举报

回复

F12 看下两者的html有什么区别

Spo0ky 2018-06-06

打赏
举报

回复

css放在＜head＞里面是什么意思？

小猫阿尤 2018-06-05

打赏
举报

回复

现在浏览器基本上都有调试功能，你按下F12 看看两个显示css有什么不同就会发现区别的

曙色萌动 2018-06-05

打赏
举报

回复

引用 8 楼 guoguoxiaotian 的回复:

[quote=引用 7 楼 qq_32386065 的回复:] 楼主我把你的代码放外面css和里面head里都试过了，效果都正确。。

来来我们好好讨论下，到底是什么问题，难道是我css里面还要加点什么，或者是引入没写好？？

[/quote]直接ctrl+c ctrl+v的 link引入没事放进去更加没事了。。

天际的海浪 2018-06-01

打赏
举报

回复

你换个浏览器试试

guoguoxiaotian 2018-06-01

打赏
举报

回复

引用 7 楼 qq_32386065 的回复:

楼主我把你的代码放外面css和里面head里都试过了，效果都正确。。

来来我们好好讨论下，到底是什么问题，难道是我css里面还要加点什么，或者是引入没写好？？

guoguoxiaotian 2018-06-01

打赏
举报

回复

引用 5 楼 qq_33817008 的回复:

感觉多了一个div,,,,

不多。。。。

爱吃藤藤菜 2018-06-01

打赏
举报

回复

感觉多了一个div,,,,

曙色萌动 2018-06-01

打赏
举报

回复

楼主我把你的代码放外面css和里面head里都试过了，效果都正确。。

天际的海浪 2018-05-31

打赏
举报

回复

也可能是缓存问题，清一下浏览器的缓存试试。

guoguoxiaotian 2018-05-31

打赏
举报

回复

引用 3 楼 jslang 的回复:

也可能是缓存问题，清一下浏览器的缓存试试。

我就差卸载浏览器了，，，

guoguoxiaotian 2018-05-31

打赏
举报

回复

引用 1 楼 jslang 的回复:

第一张图片明显#banner的样式没有应用上，检查css文件内容是否正确、文件保存的编码是否为utf-8（也就是与html文件的编码一致）。

编码格式保持一样还是这个效果 css肯定是引用了，不然logo和wel的背景颜色也不会改变，相同的代码放在head里面banner样式就会显示出来。

天际的海浪 2018-05-31

打赏
举报

回复

第一张图片明显#banner的样式没有应用上，检查css文件内容是否正确、文件保存的编码是否为utf-8（也就是与html文件的编码一致）。

1.首先要分别创建html,img和css3的文件夹。css2.html和css3的首页放在文件夹外面。还能够创建一个公共css，好比导航和页脚能够放在公共css里面，在每一个页面加上公共css超连接就能够了。减小代码的编写。html3.文件夹的名称要写成英文形式。也不要写成汉语拼音，html识别不出来汉字。html54.class与id的区别：css3(1)、在CSS文件里书写时，ID加前...

1. 首先要分别建立html,img和css3的文件夹。2. html和css3的首页放在文件夹外面。还可以建立一个公共css，比如导航和页脚可以放在公共css里面，在每个页面加上公共css超链接就可以了。减少代码的编写。3. 文件夹的名称要写成英文形式。也不要写成汉语拼音，html识别不出来汉字。4.class与id的区别：(1)、在CSS文件里书写时，ID加前缀"#"；CLASS用"."(2)...

(点击上方公众号，可快速关注)作者：德来网址：http://segmentfault.com/a/1190000004292479一、从一个面试题说起面试前端的时候我喜欢问一些看上去是常识的问题。比如：为什么大家普遍把放到导航栏的下面，结果是这样的：从上面的Timeline我们可以看出：首屏时间和DomContentLoad事件没有必然的先后关系所有CSS尽早加载是减少首屏时间的最关键js的下载...

遇到这种问题有点莫名奇妙，但其实原因是，css中有些url使用了相对定位的缘故，改变了css的路径，那么有些url就显示不了，所以才造成了差异。例如：../images/zollty.png，这种写法，一旦我改变了页面文件的目录，这张图片就无法显示了。建议是，把所有的url都写成绝对路径（网址+子目录，例如http://localhost/images/zollty....

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>css元素hover時控制另一个元素的显示隐藏</title> <style type="text/css&quo

61,112

社区成员

60,730

社区内容

发帖

与我相关

我的任务

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章