作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我想在网站顶部添加一个横幅,但根本不接触 HTML 文件。以下是横幅的 CSS 代码:
position: absolute;
top: 0px;
left: 0px;
height: 30px;
width: 100%;
background-color: #5d2c2c;
line-height: 0;
我的 CSS 文件中也有这段代码
h2:before{
content:url(https://something.png);
margin-right: 5px;
vertical-align: 10%;
}
h1:after {
content:url(https://smething.png);
float: right;
}
这是我的 HTML 代码,我无法触及它:
<head>
<title>A title </title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<link rel="stylesheet" type="text/css" href="file.css" />
</head>
<body>
<div id="content">
<h1>header1</h1>
<div id="test">
<h2>header2</h2>
<fieldset>
<legend>About You</legend>
<p id="UserInfo">What is your name?</p>
<div>
<input type="text" name="yourname" size="40" />
</div>
</fieldset>
<div id="footer">
<p>Thank you<a href="http://www.123.com/en">123</a></p>
</div>
</div>
</body>
</html>
我尝试在 CSS 文件中使用::before 作为横幅代码,但是 h2 之前的图片与横幅一起出现,我无法将它们分开!谁能帮帮我吗??!!
最佳答案
我希望这段代码可以有所帮助:jsfiddle
h1{
margin-top: 10%;
}
h1:before{
content:"";
position: absolute;
top: 0px;
left: 0px;
height: 30px;
width: 100%;
background-color: #5d2c2c;
line-height: 0;
}
关于javascript - 如何在 CSS 中添加顶部横幅而不触摸或添加任何 HTML div?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35813980/
我是一名优秀的程序员,十分优秀!