WebDesign 心得綜整

2023年2月7日星期二

V120502B - 標籤列印 & 二維條碼列印 & 列印方向: 橫向/直向 - 利用瀏覽器的列印功能 -> 列印目前瀏覽器的內容(HTML)

目的: V120502- 標籤列印 & 二維條碼列印(V120502B)

處理說明: 1> 如下以 <div> & <table> 畫出標籤內容

2> 利用瀏覽器的列印功能 -> 列印目前瀏覽器的內容(HTML)

--> 可以存取到Local印表機

--> 必需將標簽內容轉成HTML格式,然後利用瀏覽器的列印功能列印

3>預覽列印 : 利用瀏覽器的列印功能,所以可以存取到Local印表機

$('#my_div1,#my_barcode1,#break_page1,#my_div2,#break_page2,#my_div3').printThis({});

0>印表機設定:

標籤樣式: USER: 100mm*60mm

襯紙寬度: 左: 2mm 右: 2mm

方冋: 直向

1>標籤列印 :

2>二維條碼列印

3>列印方向:橫向/直向 - print.css
/* size: portrait; //* 直向
size: landscape; //* 橫向
size: A4; //* 紙張大小
size: A4 portrait; //* 混合使用
margin: 0; //* 邊界與內容的距離
*/
@media print {
@page {
size: portrait;
}
}

1>*.js - V120502B.js
//預覽列印
function mySub1_OkBtn2_click() {
//組合 print_div
//取得是否列印日期
var cur_rec, Tmp_AMMNO, Tmp_CHECK, Tmp_SAPNO, Tmp_PN, Tmp_QTY, Tmp_EOCND, Tmp_RMK, Tmp_DT;
var Tmp_sub_DT = Ext.getCmp('sub_DT').getValue();
console.log("Tmp_sub_DT:", Tmp_sub_DT);
if (Tmp_sub_DT == true)
Tmp_DT = "";
else
Tmp_DT = DatetoStr(now, "Y/m/d");

//取得 sub_store;
var Tmp_sub_Grid = Ext.getCmp('sub_Grid');
var Tmp_sub_store = Tmp_sub_Grid.store; //= gridstore
var Tmp_PageCnt = Tmp_sub_store.getCount();
if (Tmp_PageCnt == 0) {
var Tmp_Str = "請先選擇要列印的資料!!"
mywarnalert(Tmp_Str);
return;
}

var Tmp_uni = "0";
var Tmp_barcode_text = "";

var pub_print_area_Str1 = "<div id='print_area' style='border: 5px solid green;'>";
//my_div1
for (i = 0; i < Tmp_PageCnt; i++) {
//console.log("更新第 i 筆", i);
//依目前 store的資料, 更新 AMM_FACDEPD.NWK , PK( DT+DEP+EMPLYID)
cur_rec = Tmp_sub_store.getAt(i);
Tmp_AMMNO = cur_rec.data["AMMNO"];
Tmp_CHECK = cur_rec.data["CHECK"];
Tmp_SAPNO = cur_rec.data["SAPNO"];
if (checkisnull(Tmp_SAPNO))
Tmp_SAPNO = "";
Tmp_PN = cur_rec.data["PN"];
Tmp_QTY = cur_rec.data["QTY"];
Tmp_EOCND = cur_rec.data["EOCND"];
Tmp_RMK = cur_rec.data["RMK"];
if (checkisnull(Tmp_RMK))
Tmp_RMK = "";
Tmp_uni = (i + 1).toString();
//barcode 文字=件號&ECNO&日期&數量&工號&備註(機號)
Tmp_barcode_text = Tmp_PN + "&"
+ Tmp_EOCND + "&"
+ Tmp_DT + "&"
+ Tmp_QTY + "&"
+ Tmp_SAPNO + "&"
+ Tmp_RMK;

pub_print_area_Str1 = pub_print_area_Str1
+ "<div style='width: 6cm; height: 7cm;border: 1 px solid yellow;' id='my_div" + Tmp_uni + "'>"
+ "<table id = 'my_tbl" + Tmp_uni + "' style='width: 95%; height: 5cm; font-size: 10pt;

margin-top: 5pt;margin-left: 5pt; border-collapse:collapse;' border=1px borderstyle='solid' bordercolor='black' > "
+ "<tr ><th width=30% style='transform: scale(0.7);'>件號<br>(PART NO)</th>

<td width=70%>" + Tmp_PN + "</td></tr>"
+ "<tr ><th width=30% style='transform: scale(0.7);'>EO號碼<br>(EONO)</th><td width=70%>" + Tmp_EOCND + "</td></tr>"
+ "<tr ><th width=30% style='transform: scale(0.7);'>日期<br>(DATE)</th><td width=70%>" + Tmp_DT + "</td></tr>"
+ "<tr ><th width=30% style='transform: scale(0.7);'>數量<br>(QTY)</th><td width=70%>" + Tmp_QTY + "</td></tr>"
+ "<tr ><th width=30% style='transform: scale(0.7);'>工令單號<br>(SOR NO)</th><td width=70%>" + Tmp_SAPNO + "</td></tr>"
+ "<tr ><th width=30% style='transform: scale(0.7);'>品保<br>(QC)</th><td width=70%></td></tr>"
+ "<tr ><th width=30% style='transform: scale(0.7);'>備註<br>(REMARK)</th><td width=70%>" + Tmp_RMK + "</td></tr>"
+ "</table>"
+ "<table id = 'my_bottom" + Tmp_uni + "' style='width: 100%; line-height: 9pt; font-size: 7pt;border-collapse:collapse;' > "
+ "<tr >"
+ "<th width = 30% style='transform: scale(0.7);' >04/2004<br></th> "
+ "<td width = 70% style='transform: scale(0.7);' align='right' >TAG-DR-006</td>"
+"</tr > "
+ "</table>"
+ "</div>"
+ "<div id='my_div_barcode" + Tmp_uni + "' style='margin-top: 10pt;margin-left: 30pt; font-size: 6pt;' >"
+ genQRcodeStr(Tmp_barcode_text,90,90,false)
+ "</div>"
//分頁
+ "<div class='display' id='break_page" + Tmp_uni + "' style='break-after:page'></div>";

}; // for (i = 0; i < Tmp_PageCnt; i++) {

console.log("pub_print_area_Str1:", pub_print_area_Str1);
//將 [預覽列印]的 Table_div String 加入子視窗.panel
//將上次的列印資料 remove()
$("#print_area").remove();
var Tmp_sub_panel4 = $('#sub_panel4');
console.log("Tmp_sub_panel4:", Tmp_sub_panel4);
Tmp_sub_panel4.append(pub_print_area_Str1);
var Tmp_Str = "<link type='text/css' rel='stylesheet' href='../JsFunction/print.css?v=@date' " + " media='print'>";
$('head').append(Tmp_Str);
console.log("0 $('#sub_panel4').width:", $("#sub_panel4").width());
console.log("0 $('#sub_panel4').heigh:", $("#sub_panel4").height());
//顯示 [二維條碼] 在下方的 panel(sub_panel4)
var Tmp_prn_div_Str = "";
for (i = 0; i < Tmp_PageCnt; i++) {
Tmp_uni = (i + 1).toString();
Tmp_prn_div_Str = Tmp_prn_div_Str + "#my_div" + Tmp_uni;
//新增 [二維條碼] 預覽列印
Tmp_prn_div_Str = Tmp_prn_div_Str + ",#my_div_barcode" + Tmp_uni;
if (i != (Tmp_PageCnt - 1))
Tmp_prn_div_Str = Tmp_prn_div_Str + ",#break_page" + Tmp_uni + ",";
}
//if (Tmp_prn_div_Str.length > 0)
//Tmp_prn_div_Str = Tmp_prn_div_Str + "'";
console.log("Tmp_prn_div_Str:", Tmp_prn_div_Str);
//預覽列印
//$('#my_div1,#break_page2,#my_div2,#break_page3,#my_div3').printThis({
$(Tmp_prn_div_Str).printThis({
importCSS: false, // import parent page css
importStyle: false, // import style tags
loadCSS: "../JsFunction/print.css?v=@date", // path to additional css file - use an array [] for multiple
});
}

2>print.css - 設定列印方向

@page {

size: auto; /* auto is the initial value */

/* margin: 0mm 10mm 0mm 10mm; */ /* this affects the margin in the printer settings 最關鍵參數

margin: 0mm 0mm 0mm 0mm;

/*margin-left: 0mm;*/

}

body {

/*background-color: #FFFFFF;*/

margin: 0mm; /* this affects the margin on the content before sending to printer */

/*padding: 5mm 0 5mm 0;*/

}

/* size: portrait; //* 直向

size: landscape; //* 橫向

size: A4; //* 紙張大小

size: A4 portrait; //* 混合使用

margin: 0; //* 邊界與內容的距離

@media print {

@page {

size: portrait;

}

4>印表機設定畫面

V120502B 顯示二維條碼圖示 - genQRcodeDiv("mypanel", "5325YET064602&test&123eee"); - genQRcodeStr("TEST QRCODE",90,90);

目的: V120502B 產生二維條碼的圖案

處理說明: 1> 二維條碼函式庫: myfunc.js
Ext.Loader.loadScript({ url: '../JsFunction/qrcode.js'});
//barcode 文字(Tmp_barcode_text)=件號&ECNO&日期&數量&工號&備註(機號)
genQRcodeStr(Tmp_barcode_text,90,90,false);

2>[顯示二維修碼] 鈕

//將 QRCODE 圖片放於 sub_panel4

genQRcodeDiv("sub_panel4", "5325YET064602&test&123eee");

1>*.js

- myfunc.js

Ext.Loader.loadScript({

url: '../JsFunction/qrcode.js'

});

//產生二維條碼的範例 -

var mypanel = new Ext.Panel({

id: 'mypanel',

layout:'fit'

});

1>>於 DOM元件加入二維條碼圖片 - genQRcodeDiv

Ex: genQRcodeDiv("mypanel", "5325YET064602&test&123eee");

function genQRcodeDiv(destId, v, cm_x, cm_y) {

//參考網址:https://github.com/papnkukn/qrcode-svg

var qrcode = new QRCode({

content: v,

join: true, //Crisp rendering and 4-5x reduced file size

width: 100, //px

height: 100, //px,

padding: 0

});

var svg = qrcode.svg();

//$('<div></div>').html(svg+'<br>'+v).appendTo('#' + destId);

document.getElementById(destId).innerHTML = svg + '<br>' + v;

}

2>>產生二維條碼圖片字串 - genQRcodeStr

Ex: Tmp_Str=Tmp_Str+ "<div id='my_div_barcode" + Tmp_uni + "'>"

+ genQRcodeStr("TEST QRCODE")

+"</div>" ;

function genQRcodeStr( v, px_w, px_h, is_showtxt) {
//參考網址:https://github.com/papnkukn/qrcode-svg
if (checkisnull(px_w))
px_w = 50;
if (checkisnull(px_h))
px_h = 50;
var qrcode = new QRCode({
content: v,
//container: "svg-viewbox", //Responsive use
join: true, //Crisp rendering and 4-5x reduced file size
width: px_w, //px
height: px_h, //px,
padding: 0
});
var svg = qrcode.svg();
var Tmp_RtnStr = svg + '<br>' ;
if (is_showtxt)
Tmp_RtnStr = Tmp_RtnStr + v;
console.log("QR Code Str", Tmp_RtnStr);
return Tmp_RtnStr;

3>> V120502.js - [顯示二維條碼]
{
xtype: 'button',
id: 'sub_btn_OK',
flex: 3,
border: 1,
text: '二維標籤 ', //sub2
hidden: true,
iconCls: 'icon-search',
handler: function () {
//顯示 [二維條碼] 在下方的 panel(sub_panel4)
genQRcodeDiv("sub_panel4", "5325YET064602&test&123eee");
}
}, // end of 確定

PS: 條碼套件使用參考文件 -

Ext.Net 1.2.0_演示 Ext.Net+QR 码封装条形码控件

https://www.cnblogs.com/liuning8023/archive/2012/05/20/2511015.html

2023年2月2日星期四

網頁列印 - 紙張方向: 橫向(landscape) / 直向(portrait) 的設定說明

https://ithelp.ithome.com.tw/articles/10232006

今天要來介紹一個比較不常用的東西，那就是 CSS 中的列印，在以前常常會將網頁列印出來，所以經常會使用到這個屬性，時到今日，使用的時機越來越少，只有一些報表有用到，因此今天就讓我們一起看看吧！

首先我們有一個畫面，裡面有三個區塊，如下：

<body>
  <div class="page">
    <div class="box red">red</div>
  </div>
  <div class="page">
    <div class="box blue">blue</div>
  </div>
  <div class="page">
    <div class="box green">green</div>
  </div>
</body>

* {
  padding: 0;
  margin: 0;
}
.box {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 100px;
  height: 600px;
}
.red {
  border: 10px solid #f66;
}
.blue {
  border: 10px solid #66f;
}
.green {
  border: 10px solid #6f6;
}

print-page

列印方法

直接網頁上右鍵列印（Ctrl+P）
使用 javascript 的 window.print()

如果想列印指定元素可以使用 javascript 另開分頁後列印

// 例：這邊只想列印 red 區塊
const content = document.querySelector(".red").innerHTML;
const newPage = window.open("", "", "width=1000,height=500");
newPage.document.write(content);
newPage.print();

或是使用可以接下來要介紹的 CSS 來控制

CSS 列印樣式

首先我們先來看看目前列印出來的樣式
print-origin
是不是看到了一些問題呢？

頁首頁尾有怪東西
同一區塊被斷開

其實列印的時候預設會有日期、網頁標題、網址、頁碼，不過看起來有點醜，那麼如何解決哩？這邊就用到 CSS 的語法囉！

換頁

首先處理換頁的部分，這邊介紹兩個屬性，可以在列印時達到換頁的效果

.page {
  page-break-inside: avoid; /* 若順著向下排列時會切開此元素，則直接換頁 */
  page-break-after: always; /* 碰到此元素會直接換頁 */
}

print-break

@page

再來則是頁首頁尾，在 CSS 內可以使用 @page 來設定基本的列印樣式

size：設定列印的尺寸與方向，可依照紙張調整
margin：設定每頁邊界與內容的距離，小於一定數值時，則會將預設的標題等蓋過

@page {
  size: portrait; /* 直向 */
  size: landscape; /* 橫向 */
  size: A4; /* 紙張大小 */
  size: A4 portrait; /* 混合使用 */
  
  margin: 0; /* 邊界與內容的距離 */
}

設定好之後頁首頁尾就乾淨多了，如果想要上方有距離可自行設定 padding 或是 @page 內的 margin
print-@page

頁碼

剛剛將預設的東西清掉後雖然乾淨多了，不過如果還想留下頁碼怎麼辦！？這邊提供一個製作頁碼的方法

CSS 中其實有預設可用的計數器，功能有三個，分別是初始化、增加、取用

body {
  counter-reset: page-number; /* 初始化，名字可自訂，數值為0 */
}
.page {
  page-break-inside: avoid;
  position: relative;
  min-height: 100vh;
}
.page::after {
  content: counter(page-number); /* 取用該名字的計數器 */
  counter-increment: page-number 1; /* 增加計數器數值 */
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  font-size: 30px;
  text-align: center;
}

完成之後如下圖
print-page-number
此方法是定位在 page 這個 class，若是 page 的高度太高的話就不適用了

@media print

我們完成頁碼之後發現，不是在列印時也有頁碼，而且因為剛剛加上了 height: 100vh，所以也不會正常的排列了
print-all
這時候就可以用到列印中最重要的東西了，也就是 @media print，他的概念跟 ＠media screen 一樣，一個是螢幕的樣式，而另一個則是列印的樣式，已經會 RWD 的應該很好上手，那就讓我們來修改一下剛剛的問題吧！

@media print {
  .page {
    page-break-inside: avoid;
    position: relative;
    min-height: 100vh;
  }
  .page::after {
    content: counter(page-number);
    counter-increment: page-number 1;
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    font-size: 30px;
    text-align: center;
  }
}

修改完成後就大功告成了，網頁上的樣式還是本來的樣式，而列印時改成了三頁，而且顯示頁碼

結語

之前我也不是很認識列印的屬性，剛好最近工作上用到才知道，基本上都跟 RWD 的概念一樣，只是多了幾個屬性可以用，用起來還算容易，不過能看到自己做的東西照著想像的樣子印出來還是相當療癒阿！哈哈

2023年1月31日星期二

GitLab 操作說明 - 1>下載[master]最新程式 2>建立[分支] 3>上傳修改程式,[認同 & 推送]

GitLab操作說明:
1>GitLab.首頁.同步 - 從 GitLab 下載 [master]最新的專案程式
2>由下載最新的 [master] Source , 產生分支 [V120502_列印標籤]
3>[分支V120502_列印標籤]修改後, 上傳修改程式至 master , 以便合併至 master

1>GitLab.首頁.同步 - 從 GitLab 下載 [master]最新的專案程式

2>由下載最新的 [master] Source , 產生分支 [V120502_列印標籤]

3>[分支V120502_列印標籤]修改後, 上傳修改程式至 master , 以便合併至 master

2023年1月18日星期三

V80201 - store 重設 timeout &　WebService 重設 timeout -T1C - ds2T1C

目的: V80201 - store 重設 timeout &　WebService 重設 timeout - 顯示子件資料

處理說明: 呼叫WebService(WS_PDM02) 顯示子件資料
1> 後端 Webservice.重設 timeout - web.config - 10分鐘

<binding name="ServiceSoap"

receiveTimeout="00:10:00" .. >

2> 前端 store.重設 timeout - 10分鐘

Ext.getCmp('sub_Grid').store.proxy.timeout=600000;

3>Ext.Ajax 設定 timeout - 10 分鐘

Ext.Ajax.timeout = 600000; //如果有ajax timeout問題可以加上去

1>web.config - 後端 Webservice.重設 timeout - 10分鐘

<system.serviceModel>

<binding name="ZRFC_ZM66Soap" maxBufferPoolSize="524288" maxBufferSize="2147483647"

maxReceivedMessageSize="2147483647" />

<binding name="ws_als_wbshourSoap" receiveTimeout="00:15:00"

sendTimeout="00:15:00"/>

<binding name="ServiceSoap"

receiveTimeout="00:10:00"

sendTimeout="00:10:00"

maxBufferPoolSize="524288"

maxBufferSize="2147483647"

maxReceivedMessageSize="2147483647" />

</basicHttpBinding>

</binding>

</binding>

</binding>

</customBinding>

</bindings>

<endpoint address="http://aidcldap/ldapService.do" binding="basicHttpBinding"

bindingConfiguration="ILdapServiceHttpBinding" contract="aidcldap.ILdapServicePortType"

name="ILdapServiceHttpPort" />

<endpoint address="http://192.30.8.210:8503/TLSWebService.asmx"

binding="basicHttpBinding" bindingConfiguration="TLSWebServiceSoap"

contract="TLSWS.TLSWebServiceSoap" name="TLSWebServiceSoap" />

<endpoint address="http://192.168.99.36/aeispj/aeis/webservice/id40Authenticate.asmx"

binding="basicHttpBinding" bindingConfiguration="ID40AuthenticateSoap"

contract="iAIDCWebservice.ID40AuthenticateSoap" name="ID40AuthenticateSoap" />

<endpoint address="http://192.30.8.240:8100/AMMWebService.asmx"

binding="basicHttpBinding" bindingConfiguration="AMMWebServiceSoap"

contract="AMMWS_TEST.AMMWebServiceSoap" name="AMMWebServiceSoap" />

<endpoint address="http://aesweb/SAP/Zm179tls.asmx" binding="basicHttpBinding"

bindingConfiguration="zm179TlsSoap" contract="ZM179.zm179TlsSoap"

name="zm179TlsSoap" />

<endpoint address="http://194.1.5.106/SAPWS/ZRFC_ZM66.asmx" binding="basicHttpBinding"

bindingConfiguration="ZRFC_ZM66Soap" contract="ZRFC_ZM66.ZRFC_ZM66Soap"

name="ZRFC_ZM66Soap" />

<endpoint address="http://194.1.5.106/sapws/ws_als_wbshour.asmx"

binding="basicHttpBinding" bindingConfiguration="ws_als_wbshourSoap"

contract="ws_als_wbshour.ws_als_wbshourSoap" name="ws_als_wbshourSoap" />

<endpoint address="http://enovia/AMM/Service.asmx" binding="basicHttpBinding"

bindingConfiguration="ServiceSoap" contract="PDM_WS.ServiceSoap"

name="ServiceSoap" />

<endpoint address="http://194.1.5.106/sapws/ws_als_jcnhour.asmx"

binding="basicHttpBinding" bindingConfiguration="ws_als_jcnhourSoap"

contract="ws_als_jcnhour.ws_als_jcnhourSoap" name="ws_als_jcnhourSoap" />

</client>

</system.serviceModel>

</configuration>

2> 前端 store.重設 timeout - V80201A1.js

var win1 = getMyWindow("顯示子件明細資料", sub_ShowPNDetail_Flds, sub_ShowPNDetail_Btns, "A1");

win1.x =400;

win1.setWidth(700);

win1.setHeight(400);

//顯示 sub Grid 資料

var np = {};

np["PROJID"] = Ext.getCmp("sub_PROJID").getValue();

np["PDM_CONFIG"] = Ext.getCmp("sub_PDM_CONFIG").getValue();

np["PDTP"] = Ext.getCmp("sub_PDTP").getValue();

np["TYPE"] = Ext.getCmp("sub_TYPE").getValue();

//目前所選件號(PN),ECNO,情況處理碼(CNDPROCCODE)

np["PN"] = par_PN;

np["ECNO"] = par_ECNO;

np["CNDPROCCODE"] = par_CNDPROCCODE;

np["ASN"] = par_ASN;

np["PROCWC"] = par_PROCWC;

Ext.getCmp('sub_Grid').store.getProxy().url = '../api/V80201A1API/getsubData';

Ext.getCmp('sub_Grid').store.getProxy().extraParams = np;　//分頁OK,篩選條件OK

//Ext.getCmp('sub_Grid').store.clearOnPageLoad = true;

//Ext.getCmp('sub_Grid').reloadGridData();

//重新設定store.proxy 的timeout 時間(10分鐘), 以免store載入時間 timeuot , 出現 Error

Ext.getCmp('sub_Grid').store.proxy.timeout=600000;

Ext.getCmp('sub_Grid').store.on("load", function (me, records, successful, eOpts) {

console.log("STEP2 Ext.getCmp(sub_Grid).store.on(load ..");

console.log("successful:", successful);

console.log("records:", records);

if (successful) {

console.log("successful");

console.log("Ext.getCmp('sub_Grid').store.data", Ext.getCmp('sub_Grid').store.data);

win1.show();

//若已載入完成,則

//Ext.getCmp('waitlbl').setVisible(false);

Ext.getCmp("myMask").hide();

//myMask.unmask();

//myMask.hide();

}

);

Ext.getCmp('sub_Grid').store.load();

console.log(" STEP 1 Ext.getCmp('sub_Grid').store.load() ");

Ext.getCmp('sub_Grid_ptb').hide();

}; // end of function ShowPNBtn_click() {

3>*.cs - V80201A1APIController.cs

//重新設定WebService 的timeout 時間(10分鐘), 以免呼叫 WebService timeuot , 出現 Error

DataSet ds = PDM02.AMM_PDM02(Tmp_PN, Tmp_ECNO,Tmp_CNDPROCCODE, Tmp_PDTP,

Tmp_ASN,Tmp_PROJID, Tmp_PROCWC);

//將 ds 轉成標準的 T1C 格式(TMGrid)

ds = myfunc.ds2T1C(ds);

訂閱：意見 (Atom)

2023年2月7日星期二

V120502B - 標籤列印 & 二維條碼列印 & 列印方向: 橫向/直向 - 利用瀏覽器的列印功能 -> 列印目前瀏覽器的內容(HTML)

V120502B 顯示二維條碼圖示 - genQRcodeDiv("mypanel", "5325YET064602&test&123eee"); - genQRcodeStr("TEST QRCODE",90,90);

2023年2月2日星期四

網頁列印 - 紙張方向: 橫向(landscape) / 直向(portrait) 的設定說明

列印方法

CSS 列印樣式

換頁

@page

頁碼

@media print

結語

2023年1月31日星期二

GitLab 操作說明 - 1>下載[master]最新程式 2>建立[分支] 3>上傳修改程式,[認同 & 推送]

2023年1月18日星期三

V80201 - store 重設 timeout &　WebService 重設 timeout -T1C - ds2T1C

WebDesign 心得綜整

追蹤者

網誌存檔

關於我自己

2023年2月7日 星期二

V120502B - 標籤列印 & 二維條碼列印 & 列印方向: 橫向/直向 - 利用瀏覽器的列印功能 -> 列印目前瀏覽器的內容(HTML)

V120502B 顯示 二維條碼 圖示 - genQRcodeDiv("mypanel", "5325YET064602&test&123eee"); - genQRcodeStr("TEST QRCODE",90,90);

2023年2月2日 星期四

網頁列印 - 紙張方向: 橫向(landscape) / 直向(portrait) 的設定說明

列印方法

CSS 列印樣式

換頁

@page

頁碼

@media print

結語

2023年1月31日 星期二

GitLab 操作說明 - 1>下載[master]最新程式 2>建立[分支] 3>上傳修改程式,[認同 & 推送]

2023年1月18日 星期三

V80201 - store 重設 timeout & WebService 重設 timeout -T1C - ds2T1C

WebDesign 心得綜整

追蹤者

網誌存檔

關於我自己

2023年2月7日星期二

V120502B 顯示二維條碼圖示 - genQRcodeDiv("mypanel", "5325YET064602&test&123eee"); - genQRcodeStr("TEST QRCODE",90,90);

2023年2月2日星期四

2023年1月31日星期二

2023年1月18日星期三

V80201 - store 重設 timeout &　WebService 重設 timeout -T1C - ds2T1C