Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/69.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
如何在HTML CSS中打印60度旋转水印_Html_Css - Fatal编程技术网

如何在HTML CSS中打印60度旋转水印

如何在HTML CSS中打印60度旋转水印,html,css,Html,Css,我有一个A4大小的HTML页面。我用CSS把它做成A4大小。现在我想以60度的角度在页面上打印水印。但我找不到任何解决办法。我在谷歌上搜索了很多次,但都失败了。有人能帮我吗 这是该页面的CSS <style> body { width: 100%; height: 100%; margin: 0; padding: 0; background-color: #F0F0F0; font: 12pt "Times New Roman";

我有一个A4大小的HTML页面。我用CSS把它做成A4大小。现在我想以60度的角度在页面上打印水印。但我找不到任何解决办法。我在谷歌上搜索了很多次,但都失败了。有人能帮我吗

这是该页面的CSS

 <style>
 body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    background-color: #F0F0F0;
    font: 12pt "Times New Roman";
    }
    * {
        box-sizing: border-box;
        -moz-box-sizing: border-box;
    }
    .page {
        width: 210mm;
        min-height: 297mm;
        padding: 08mm;
        margin: 2mm auto;
        border: 1px #D3D3D3 solid;
        border-radius: 5px;
        background: white;
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);

    }
    .subpage {
        padding: 1cm;
        border: 5px solid;
        height: 257mm;
        outline: 2cm #FFEAEA solid;
    }

    @page {
        size: A4;
        margin: 0 0em 0em 0em;
    }
    @media print {
        html, body {
            width: 210mm;
            height: 297mm;  
            -webkit-print-color-adjust: exact    
        }
        .page {
            margin: 0;
            border: initial;
            border-radius: initial;
            width: initial;
            min-height: initial;
            box-shadow: initial;
            background: initial;
            page-break-after: always;
        }
        </style>

使用不透明度和位置固定

.for-watermark-div
{
 position: fixed;
 bottom: 257px;
 right: 100px;
 opacity: 0.5;
 z-index: 99;
 color: hotpink;
 /* Rotate div */
 -ms-transform: rotate(60deg); /* IE 9 */
 -webkit-transform: rotate(60deg); /* Chrome, Safari, Opera */
 transform: rotate(60deg);
}

使用不透明度和位置固定

.for-watermark-div
{
 position: fixed;
 bottom: 257px;
 right: 100px;
 opacity: 0.5;
 z-index: 99;
 color: hotpink;
 /* Rotate div */
 -ms-transform: rotate(60deg); /* IE 9 */
 -webkit-transform: rotate(60deg); /* Chrome, Safari, Opera */
 transform: rotate(60deg);
}

您是否尝试过将水印图像设置为页面背景?我想打印文本水印使用css的目的是什么?用户只需在打印前删除水印即可。此文件用于内部办公室。您是否尝试过将水印图像设置为页面背景?我想打印文本水印使用css水印的目的是什么?用户只需在打印前删除水印即可。此文件用于内部办公室。需要水印。它在底部打印水印,角度为90度,但我想在页面中间打印水印,角度为60度。底部打印水印,角度为90度,但我想在页面中间打印水印,角度为60度