李政翰vscode, html檔案, css檔案, js檔案

 
HTML檔案

<!html註解style.css, scrip.JS>
<link rel="stylesheet" href="style.css">
<script src="myscript.js"></script>
<ol start="297">
<li><select id='297'><option></option><option>1</option><option>2</option><option>3</option><option>4</option></select><span class="Q">下列何者非屬資訊安全的基本三要素&#65311;</span>ol type='1'><li>一致性(Consistence)</li><li>完整性(Integrity)</li><li>可用性(Availability)</li><li>機密性(Confidentiality)</li></ol></li>
<li><select id='298'><option></option><option>1</option><option>2</option><option>3</option><option>4</option></select><span class="Q">下列何者非屬組織採用雲端運算服務的常見考量原因&</span>65311;<ol type='1'><li>商譽</li><li>成本</li><li>速度</li><li>效能</li></ol></li>
<li><select id='299'><option></option><option>1</option><option>2</option><option>3</option><option>4</option></select><span class="Q">下列何種數據資料單位代表1024GB&#6531</span>;<ol type='1'><li>1ZB</li><li>1EB</li><li>1PB</li><li>1TB</li></ol></li>
<li><select id='300'><option></option><option>1</option><option>2</option><option>3</option><option>4</option></select><span class="Q">下列哪一個名詞和其他三個名詞不同義&#65311</span><ol type='1'><li>數據資料</li><li>大數據</li><li>巨量資料</li><li>海量資料</li></ol></li>
<li><select id='301'><option></option><option>1</option><option>2</option><option>3</option><option>4</option></select><span class="Q">下列何者非屬網際網路興起後的數位商品或服務模式&</span>65311;<ol type='1'><li>純網路銀行</li><li>電子資金轉帳</li><li>電子商務支付系統</li><li>加密貨幣</li></ol></li>
<li><select id='302'><option></option><option>1</option><option>2</option><option>3</option><option>4</option></select><span class="Q">機器人是人工智慧的容器&#65292;機器人是身</span>&#65292;而人工智慧可以比喻成機器人的哪一部分&#65311;<ol type='1'><li>心臟</li><li></li><li></li><li>大腦</li></ol></li>
<li><select id='303'><option></option><option>1</option><option>2</option><option>3</option><option>4</option></select><span class="Q">當保險業欲透過網路與電話語音等通路提供服務時&#</span>5292;可運用何項技術驗證身分&#65311;<ol type='1'><li>生物辨識</li><li>通訊技術</li><li>物聯網技術</li><li>網路技術</li></ol></li>
<li><select id='304'><option></option><option>1</option><option>2</option><option>3</option><option>4</option></select><span class="Q">下列何項敘述非屬純網路銀行的明顯獨特特色&#65</span>11;<ol type='1'><li>沒有實體分行</li><li>沒有實體ATM機器</li><li>營業時間無限制全年無休</li><li>透過APP 提供金融服務</li></ol></li>
<li><select id='305'><option></option><option>1</option><option>2</option><option>3</option><option>4</option></select><span class="Q">下列何者非屬我國核准設立之純網路銀行&#6531</span>;<ol type='1'><li>連線銀行</li><li>將來銀行</li><li>新網銀行</li><li>樂天銀行</li></ol></li>
<li><select id='306'><option></option><option>1</option><option>2</option><option>3</option><option>4</option></select><span class="Q">目前各國金融監理機關對比特幣抱持戒慎恐懼的態度&</span>65292;考量的原因包含下列哪幾項&#65311; A.洗錢 B.資恐 C.逃稅 D.詐騙 <ol type='1'><li>僅 A</li><li>僅 A&#12289;B</li><li>僅 A&#12289;B&#12289;C</li><li>A&#12289;B&#12289;C&#12289;D</li></ol></li>

<BUTTON class="Q"> onclick='s297306()'>送出297至306答ON>

<p id="show297306">顯示答案</p>

<h2>講解297至306</h2>
<iframe width="560" height="315" src="https://www.youtube.com/embed/M72opuoGSZA" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
</ol>
<h1 style="BACKGROUND-COLOR: rgb(131, 210, 237);">心得</h1>
使用外部css
&#60;link rel="stylesheet" href="style.css"> &#62;
There are three ways of inserting a style sheet:

External CSS今天使用樣式放在另一個獨立的檔案,必須使用link
Internal CSS定義style要class或者h1{}...
Inline CSS

CSS檔案

<style>H1{BACKGROUND-COLOR: TOMATO; COLOR: WHITE; BORDER:BLUE SOLID 5PX; PADDING: 5PT; TEXT-ALIGN: CENTER;}
  OL{FONT-WEIGHT: NORMAL; FONT-SIZE:14 PT; background-color: white; color:black}S
  .Q{FONT-WEIGHT: BOLD; FONT-SIZE:16PT; BACKGROUND-COLOR:darkGREEN; color:white;}
  SELECT{font-size: 14pt; background-color: black; color: white;}</style>

JS檔案

function s297306(){
  var s = '<table border=2><tr><td>297</td><td>298</td><td>299</td><td>300</td><td>301</td><td>302</td><td>303</td><td>304</td><td>305</td><td>306</td></tr><tr>';
  var g = 0;    
  var a297 = document.getElementById('297').value;  if ( a297 == '1' ) { g++; s+= '<td>O</td>'} else { s += '<td>X</td>'};  
  var a298 = document.getElementById('298').value;  if ( a298 == '1' ) { g++; s+= '<td>O</td>'} else { s += '<td>X</td>'};  
  var a299 = document.getElementById('299').value;  if ( a299 == '4' ) { g++; s+= '<td>O</td>'} else { s += '<td>X</td>'};  
  var a300 = document.getElementById('300').value;  if ( a300 == '1' ) { g++; s+= '<td>O</td>'} else { s += '<td>X</td>'};
  var a301 = document.getElementById('301').value;  if ( a301 == '2' ) { g++; s+= '<td>O</td>'} else { s += '<td>X</td>'};  
  var a302 = document.getElementById('302').value;  if ( a302 == '4' ) { g++; s+= '<td>O</td>'} else { s += '<td>X</td>'};  
  var a303 = document.getElementById('303').value;  if ( a303 == '1' ) { g++; s+= '<td>O</td>'} else { s += '<td>X</td>'};  
  var a304 = document.getElementById('304').value;  if ( a304 == '4' ) { g++; s+= '<td>O</td>'} else { s += '<td>X</td>'};  
  var a305 = document.getElementById('305').value;  if ( a305 == '3' ) { g++; s+= '<td>O</td>'} else { s += '<td>X</td>'};  
  var a306 = document.getElementById('306').value;  if ( a306 == '4' ) { g++; s+= '<td>O</td>'} else { s += '<td>X</td>'};  
  s += '<td>' + g + '</td></tr></table>';
  document.getElementById('show297306').innerHTML = s;
}
</script>

留言

  1. 第一個截圖不清楚,其他的還好。以後要順便貼上程式碼,整理所學,才能將所學內化到心理。

    回覆刪除

張貼留言

這個網誌中的熱門文章

李政翰EXCEL與python執行樞紐分析的比較