網頁呼叫谷歌瀏覽器列印指定區域為pdf

阿新 • • 發佈：2019-01-20

先貼上程式碼。

<!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> 
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
  <style media="print">  
        .noprint 
 {  
            display: none;  
        }  
    </style>
  <script src="https://img.hcharts.cn/highcharts/highcharts.js"></script>
 </head>   
 <body> 
  <div class="noprint" style="width:800px;margin:30px auto 0 auto;text-align:right;"> 
   <input value="列印" type="button" 
 onclick="window.print()" /> 
  </div> 
  <div style="width:640px;margin:20px auto;"> 
   <center>
    <img src="https://www.baidu.com/img/bd_logo1.png" style="width: 180px;" />
   </center> 
   <div id="container" style="min-width:400px;height:400px"></div> 
  </div> 
  
  <script type="text/javascript">
var chart = new Highcharts.Chart('container', {
    title: {
        text: '不同城市的月平均氣溫', 
    },
    subtitle: {
        text: '資料來源: WorldClimate.com', 
    },
    xAxis: {
        categories: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月']
    },
    yAxis: {
        title: {
            text: '溫度 (°C)'
        },
        plotLines: [{
            value: 0,
            width: 1,
            color: '#808080'
        }]
    },
    tooltip: {
        valueSuffix: '°C'
    },
    legend: {
        layout: 'vertical',
        align: 'right',
        verticalAlign: 'middle',
        borderWidth: 0
    },
    series: [{
        name: '東京',
        data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]
    }, {
        name: '紐約',
        data: [-0.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 24.1, 20.1, 14.1, 8.6, 2.5]
    }, {
        name: '柏林',
        data: [-0.9, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0]
    }, {
        name: '倫敦',
        data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]
    }]
});

</script> 
 </body>
</html>

其中，以下內容是控制列印區域的，只要把元素添加了noprint類，就可以列印的時候隱藏他們。

<style media="print"> .noprint { display: none; } </style>
`window.print()是呼叫列印的函式。

效果圖如下：
這裡寫圖片描述

列印pdf視窗如下：
這裡寫圖片描述

網頁呼叫谷歌瀏覽器列印指定區域為pdf

先貼上程式碼。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtm

webdirver.Chrom() selenium webdirver呼叫谷歌瀏覽器的問題解決

第一個坑：沒有將谷歌驅動放到 /usr/local/bin 目錄下第二個坑：沒有將谷歌瀏覽器.exe放在 /usr/local/bin 目錄下（注意:驅動和瀏覽器在一個路徑下才能使用啊，不會報錯才怪哩） &

用selenium實現用谷歌瀏覽器開啟指定網址

一：前期準備需要下載兩個jar包（我這裡是2.25.0版本的，可以在網上下載最新的）和一個exe檔案 1：selenium-java-2.25.0.jar 2：selenium-server-standalone-2.25.0

谷歌瀏覽器列印縮放問題

問：在谷歌瀏覽器中進行列印，頁面顯示不完，如何進行縮放？答：1、win10部分版本中，谷歌瀏覽器列印設定中有自帶的縮放選項。 2、如果沒有，可以使用系統自帶的列

無緣無故,谷歌瀏覽器主頁被篡改為360導航，如何解決？

今天早上一來公司，發現電腦上各個瀏覽器的主頁都變成了360導航頁面，怎麼改都改不掉，太TM噁心了，360憑藉安全衛士的優勢強制更改使用者配置，你說你要臉嗎？後來在度娘裡終於找到了一個比較不錯的解決辦

谷歌瀏覽器提示該網頁已屏蔽以下插件

.cn mage log code 網址啟動 -i pre 谷歌打開谷歌瀏覽器在網址欄輸入： chrome://flags/#run-all-flash-in-allow-mode 把設置從default修改為enabled

第一個谷歌瀏覽器擴展插件操作網頁

擴展 ava 技術分享 alert browser miss 解壓 manifest his 輕松入門一個全局配置文件一個icon圖標一個測試js myscript.js alert(‘測試‘); 　　 { "name": "刷紅包(演示)",

谷歌瀏覽器怎樣把網頁全部內容保存為.mhtml文件？

com height 啟用地址 bubuko inf pos width led Chrome保存.mhtml網頁文件的方法: 在 Chrome 地址欄中鍵入chrome://flags，回車，在頁面搜索欄輸入mhtml 把“Save Pag

谷歌瀏覽器修改cookie訪問網頁的小插件——EditsThisCookie

edits tst 不能成績存在的人 wid 鍵值 eight cookie是服務器用來區分不同的瀏覽器客戶端的，比如學生A和B同一時段用各自的電腦訪問學校訪問學校的教務系統查看成績，登錄之後，訪問同一頁面確出來不同的信息，並且不能查看對方的信息，這就是因為服務器用利

谷歌瀏覽器設置新標簽欄打開指定頁面

地址瀏覽器設置 alt 離線 www mage 如何技術分享 spn 設置新標簽頁打開特定網頁參考下面經驗"如何離線安裝Chrome插件?"，下載安裝"Replace New Tab Page"擴展程序，打開新標簽頁時，輸入你想要的打開的網頁網址，保存後即可。

谷歌瀏覽器呼叫攝像頭並拍照

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, ini

詳解網頁開發中的頁面除錯【主要是谷歌瀏覽器的F12除錯功能】

做過網頁開發的都知道，不過你是用php還是asp.net以及java開發的網站，在開發過程中，web網頁展示頁面肯定會出現或多或少的問題。這裡我推薦使用谷歌瀏覽器進行Web網頁的除錯以及錯誤資訊定位。使用谷歌瀏覽器除錯網頁，一般無需另外下載瀏覽器外掛，使用谷歌瀏覽器自帶的F12除錯功能即可完成大部分的除錯

詳解網頁開發中的頁面調試【主要是谷歌瀏覽器的F12調試功能】

it技術標註 str cookie信息文檔 https請求錯誤資源文件首頁做過網頁開發的都知道，不過你是用php還是asp.net以及java開發的網站，在開發過程中，web網頁展示頁面肯定會出現或多或少的問題。這裏我推薦使用谷歌瀏覽器進行Web網頁的調試以及錯

【開發除錯】谷歌瀏覽器中除錯移動網頁和測試網速下頁面效果

、今天有幸給大家分享一下谷歌瀏覽器針對移動網頁測試的技巧，主要是最近做個微信公共號網站。所以就要對頁面測試拉。移動網頁我們最長測得就是各種手機大小的頁面效果和出現網路問題的效果展示。今天就簡單分享下在谷歌瀏覽器測試頁面的適配和網速限制展示。頁面的適配自帶的手機模式首先開啟谷歌瀏覽器按F

谷歌瀏覽器的列印功能

var OpenWindow = window.open(""); OpenWindow.document.write("<HTML>"); OpenWindow.document.write("<HEAD>"); OpenWindow

谷歌瀏覽器和internet explorer所有網頁打不開，而Edge瀏覽器卻可以開啟網頁

我由於安裝Visualbox進行hadoop分散式環境搭建導致了題目中的問題，經過網上查閱資料，才知道原來是LSP異常所致。只需要在命令列視窗中輸入下面命令： netsh winsock reset

谷歌瀏覽器測試網頁載入時間

1、首先開啟谷歌瀏覽器； 2、然後隨便開啟一個網頁，右擊滑鼠，選擇檢查，進入到如下頁面： 3、點選右側的 TimeLine，顯示如下： 4、然後重新整理左側頁面，就會在右邊顯示載入時間，如下： 5、如果想測試當前網址在相應的手機網路上響應時間，點選手機標誌，

js網頁列印指定區域內容

方法一： <script language="javascript" type="text/javascript"> function printpage(myDiv){ //var newstr = document.all.item(m

Chrome 谷歌瀏覽器呼叫攝像頭並拍照上傳 java示例

html頁面： <!DOCTYPE html> <html> <head> <title>html5呼叫攝像頭實現拍照</title> <meta charset="utf-8"> <me

谷歌瀏覽器安裝去除網頁廣告外掛

目標：上網搜尋學習資料時，網頁的廣告太多，還一閃一閃的影響學習與工作。通過給谷歌瀏覽器安裝外掛，過濾掉廣告。事件：我上網搜尋“ORA-12547:TNS:丟失連線”問題為例，這個問題很難解決，查看了幾十個網站，被廣告煩的不行不行的。過濾廣告的效果：同一個網頁，

網頁呼叫谷歌瀏覽器列印指定區域為pdf

相關推薦