我猜我需要一个文档类型,因为下面的字体样式只在 Safari 和 Chrome 中以我想要的方式出现。所以每次我添加 HTML5 文档类型时,用我的自定义字体书写都会消失。我是一名业余编码员,所以请使用我自学的代码。
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8"/>
<style type="text/css">
#yolk {
background-image: url(Yolk.png);
background-repeat: no-repeat;
background-position: center top;
padding-top:250px;
}
body {
background-color:#000000;
}
#lol {
background-image: url(lol.png);
background-repeat: no-repeat;
background-position: center top;
padding-top: 100px;
padding-bottom: 100px;
}
@font-face {
font-family: my_font;
src: url('http://myurl.com/lolfont.eot');
src: url('lolfont.eot'), url('lolfont.ttf') format('opentype');
}
p {
font-family: my_font;
color: de0000;
text-align: left;
font-size: 50px;
line-height: 10%;
text-indent: 350px;
}
</style>
<title>yolk</title>
</head>
<body>
<div id="yolk"></div>
<center>
<embed allowScriptAccess="never" src="http://swing.awardspace.com/newcoun… width=320 height=110 wmode=transparent menu=false></embed>
</center>
<p>test</p>
<a href="http://www.google.com" title="lol"><div id="lol"></div></a>
</font>
</html>
最佳答案
始终 validate your HTML第一的。尝试使用无效标记做任何事情时,您只会浪费自己和其他人的时间。然后,您可以 validate your CSS .
我发现的错误:
-
<!DOCTYPE HTML>
应该是<!DOCTYPE html>
因为你正在使用 XML serialization ,区分大小写。<!DOCTYPE
之后的东西是文档根元素的名称。另见 Uppercase or lowercase doctype?在 SO 上。 -
color: de0000;
应该是color: #de0000;
. body
元素必须关闭。地点</body>
就在</html>
之前.- 删除
</font>
tag – 没有开始标签。还有font
element is obsolete . - 替换
center
element与div
有style="text-align: center"
.它已经过时了。 - 修复
<embed allowScriptAccess="never" src="http://swing.awardspace.com/newcoun… width=320 height=110 wmode=transparent menu=false></embed>
. HTML5 的 XML 序列化中的所有属性都必须在其值周围加上引号。src
的内容属性明显被截断,缺少最后的引号。
关于html - Doctype 搞乱了 CSS 字体样式?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10761453/