Html 未应用文档头中的css样式_Html_Css

Html 未应用文档头中的css样式

html css

Html 未应用文档头中的css样式,html,css,Html,Css,如果问题太简单，我很抱歉。我肯定是的，但我已经通过W3C.org上的验证器将这段代码放到了这个网站上，并查看了该网站上的相关链接和字符串，但我没有找到任何答案，至少我能理解我有一个非常基本的html文档，其中包含一些css样式。我所要做的就是使用简单的css样式将副本环绕图像我只是在学习如何做到这一点，并遵循一本书中的一个示例，但代码并没有按照预期的方式工作这是我的密码。我做错了什么？（我正在优胜美地使用Chrome和Safari。 _____________________代码开头___

如果问题太简单，我很抱歉。我肯定是的，但我已经通过W3C.org上的验证器将这段代码放到了这个网站上，并查看了该网站上的相关链接和字符串，但我没有找到任何答案，至少我能理解

我有一个非常基本的html文档，其中包含一些css样式。我所要做的就是使用简单的css样式将副本环绕图像

我只是在学习如何做到这一点，并遵循一本书中的一个示例，但代码并没有按照预期的方式工作

这是我的密码。我做错了什么？（我正在优胜美地使用Chrome和Safari。 _____________________代码开头_____________________

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd">

<head> 
<title>Float</title> 
<meta http-equiv="content-type"  content="text/html lang="en-US">

<style type="text/css"> 

.featureimage {   
float: left;   
width: 300px; 
}
p.copy {    
float: right;   
align: center; 
} 
</style>

</head>

<body> 
<h1>This Is A Very Large Housing D,evelopment.</h1>

<img src="BLDGS-300x200.jpg" width="300" height="200" alt="hi-rise" class="featureimage">


<p class="copy"> At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti atque corrupti, quos dolores et quas molestias excepturi sint, obcaecati cupiditate non provident, similique sunt in culpa, qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore,  repellat… </p>

</body>

</html>

_________________ end of code ______________________


浮动
这是更新代码
        <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
        <html xmlns="http://www.w3.org/1999/xhtml">
        <head>
        <title>Float</title> 
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

        <style type="text/css"> 

        .featureimage {   
        float: left;   
        width: 300px; 
        }
        p.copy {    
        float: right;   
        align: center; 
        } 
        </style>

        </head>

        <body> 
        <h1>This Is A Very Large Housing D,evelopment.</h1>

        <img src="BLDGS-300x200.jpg" width="300" height="200" alt="hi-rise" class="featureimage" />


        <p class="copy"> At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti atque corrupti, quos dolores et quas molestias excepturi sint, obcaecati cupiditate non provident, similique sunt in culpa, qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore,  repellat… </p>

        </body>

        </html>


浮动
.featureimage{
浮动：左；
宽度：300px；
}
p、 复制{
浮动：对；
对齐：居中；
} 
这是一个非常大的住宅开发区。
在杜西莫斯总统的任期内，由于腐败、腐败和其他犯罪行为的存在，导致死亡和其他犯罪行为的发生，因此，在犯罪行为中不存在类似的情况，因为官员应该得到动物的保护，这是劳动和救济，而受害者则应该得到应有的回报南自由临时议会

希望一切顺利！
元素（和其他块）的默认宽度在大多数浏览器中是100%。正因为如此，文本不适合图像旁边，并被推到下一行。请尝试为段落指定宽度。
因为您在段落上指定了float:right
，所以它与先前浮动内容交互的规则会发生变化。这会将其向下推到一行
移除float:right
，文本将环绕图像

align:center
是无效的CSS。没有像align
这样的属性，我要传递@（带有两个警告）只需使用：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head> 
<title>Float</title> 


<style type="text/css"> 
.featureimage {   
float: left;   
margin: 0 10px 10px 0;
}
</style>

</head>

<body> 

<h1>This Is A Very Large Housing D,evelopment.</h1>

<p><img src="building.jpg" width="300" height="200" alt="hi-rise" class="featureimage">
At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti atque corrupti, quos dolores et quas molestias excepturi sint, obcaecati cupiditate non provident, similique sunt in culpa, qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore,  repellat… At vero eos et accusamus et iusto odio dignissimos ducimus, qui blanditiis praesentium voluptatum deleniti atque corrupti, quos dolores et quas molestias excepturi sint, obcaecati cupiditate non provident, similique sunt in culpa, qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore,  repellat… </p>

</body>

</html>


浮动
.featureimage{
浮动：左；
利润率：0 10px 10px 0；
}
这是一个非常大的住宅开发区。

在杜西莫斯的最高法院和最高法院，由于腐败行为导致的腐败行为、大量的犯罪行为和非法的犯罪行为除外，法院的判决是不可预见的，同样也有过错，因此，法院的判决是对动物的惩罚，是对劳动和财产的惩罚，而法院的判决则是对财产和财产的惩罚时间自由、时间自由、时间自由……在维罗·eos和accusamus和iusto Digissimos ducimus，由于腐败导致的暴力行为、犯罪行为和犯罪行为除外的其他犯罪行为、不受保护的丘比特人、同样有罪的人、因犯罪而受到惩罚的人、因劳动而受到惩罚的人、因犯罪而受到惩罚的人，等等这是一种暂时性的、排斥性的、不自由的行为

这些警告涉及：
没有在文档级别声明字符编码
在文档中未找到字符编码信息，
在HTML元元素或XML声明中。通常
建议在文档本身中声明字符编码，
尤其是当文件有可能被读取或删除时
保存到磁盘、CD等
请参见本教程
()
关于字符编码的技术和解释
jsFIDLE:
这实际上没有什么区别。我说这没有区别，不是说你的代码没有区别。修复错误不会改变文档的呈现方式。您好，@Quentin是的，您的权利。我从您那里学到了更多：）您好，@Quentin missing正在启动html和图像标记。是吗？HTML开始标记在HTML中是可选的。IMG标签没有丢失。“HTML4.01过渡”-此Doctype设计用于简化从HTML3.2文档到HTML4和CSS的过渡。本世纪应该避免这种情况。应该是有用的阅读。您的CSS中有一个验证程序会发现的错误：您说您通过验证程序运行了它，但在该代码中发现了几个错误。您缺少
上面的
标记在大多数浏览器中
和其他块）元素的默认宽度是100%不正确的。默认宽度为auto
为什么要投反对票？这位女士问：“我想做的就是用一个简单的css样式将拷贝环绕在图像上。”。这就是我展示的。我还通过了HTML，以便在网站上放置W3徽章。