Question

css我正在尝试使用css创建一个打印样式表来连接到我的html网页。我在下面添加了样式表行，我的样式表是一个名为print.css的css文件，与我的html文件位于同一目录中。这是我第一次这样做，就程序而言，我做错了吗？

感谢您的任何建议

HTML

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="print.css" media="print"/>

<style>
   .
   .
   .
</style>

</head>

CSS

 <!DOCTYPE html>
 <html>
 <head>
 <style>
 body{
 width: 8000px;
 background-color: #FFFFFF;
  }
  .section{
  width: 2000px;
  float: left;
  height: 100%;
  z-index: 1;
  font-size:20px;
  page-break-after: always;
  page-break-inside: avoid;



  p a:after {
  content: " (" attr(href) ")";
  font-size: 50%;
   }
 </style>
 </head>
 </body>
 </html>

Answer 1

CSS文件不能包含HTML。这是你的print.css文件应该包含的全部内容：

body{
    width: 8000px;
    background-color: #FFFFFF;
}

.section{
    width: 2000px;
    float: left;
    height: 100%;
    z-index: 1;
    font-size:20px;
    page-break-after: always;
    page-break-inside: avoid;
}

p a:after {
    content: " (" attr(href) ")";
    font-size: 50%;
}

Answer 2

您已在CSS文件中包含HTML，但无效。您需要删除<!DOCTYPE html> <html> <head> and <style>代码。

您还忘记使用右括号关闭.section css，所以它看起来像这样：

.section{
width: 2000px;
float: left;
height: 100%;
z-index: 1;
font-size:20px;
page-break-after: always;
page-break-inside: avoid; }

除此之外，检查您的CSS文件与link标记中指定的名称相同 - 您可能在某处出现拼写错误。

Answer 3

调用css文件时href错误：

您正在调用可能不存在的HTML文件

<link href="print.html" type="text/css" rel="stylesheet" media="print" />

如果确实存在，请从该HTML文件中提取您的CSS并将其放入CSS文档中，然后链接到这样的文件：

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

在该文件中将您的样式包装在此标记中：

@media print { 你的CSS在这里 }

这应该完全符合你的需要。

为什么我的html链接到我的打印CSS样式表？

3 个答案: