-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
80 changed files
with
64,501 additions
and
0 deletions.
There are no files selected for viewing
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,376 @@ | ||
<!DOCTYPE html> | ||
<body lang="en" > | ||
<head> | ||
<meta charset="UTF-8"> | ||
<title>Thông tin về nguyên tử Argon</title> | ||
<link rel="stylesheet" href="./styleInfo/css/azia.css"> | ||
<script type="module" src="https://cdn.jsdelivr.net/npm/@google/model-viewer/dist/model-viewer.min.js"></script> | ||
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-90680653-2"></script> | ||
<script> | ||
window.dataLayer = window.dataLayer || []; | ||
function gtag(){dataLayer.push(arguments);} | ||
gtag('js', new Date()); | ||
|
||
gtag('config', 'UA-90680653-2'); | ||
</script> | ||
</head> | ||
<body> | ||
<!-- thanh menu --> | ||
<div class="az-header"> | ||
<div class="container"> | ||
<div class="az-header-left"> | ||
<a href="index.html" class="az-logo"><span></span>Argon</a> | ||
<a href="" id="azMenuShow" class="az-header-menu-icon d-lg-none"><span></span></a> | ||
</div><!-- az-header-left --> | ||
<div class="az-header-menu"> | ||
<div class="az-header-menu-header"> | ||
<a href="index.html" class="az-logo"><span></span> azia</a> | ||
<a href="" class="close">×</a> | ||
</div><!-- az-header-menu-header --> | ||
<ul class="nav"> | ||
<li class="nav-item active show"> | ||
<a href="#properties"> Properties</a> | ||
</li> | ||
<li class="nav-item active show"> | ||
<a href="#tinhchathoahoc"> Tính chất hóa học</a> | ||
</li> | ||
|
||
<li class="nav-item"> | ||
<a href="#dieuche" > Điều chế</a> | ||
</li> | ||
<li class="nav-item"> | ||
<a href="#ungdung" ></i> Ứng dụng</a> | ||
</li> | ||
</ul> | ||
</div> | ||
</div> | ||
</div> | ||
|
||
<div class="container"> | ||
<!-- header properties --> | ||
<div class="az-dashboard-one-title" > | ||
<div> | ||
<h2 class="az-dashboard-title" style="text-align: justify;font-family:times new roman,times,serif; font-size:22px;">1.Properties</h2> | ||
</div> | ||
</div> | ||
|
||
<!-- nội dung Properties --> | ||
<div class="row row-sm mg-b-20" id="properties"> | ||
<div class="col-lg-4"> | ||
<div class="card card-dashboard-pageviews"> | ||
<div class="card-header"> | ||
<h6 class="card-title">Properties</h6> | ||
</div> | ||
<div class="card-body"> | ||
<div class="az-list-item"> | ||
<div> | ||
<h6>Khối lượng nguyên tử</h6> | ||
</div> | ||
<div> | ||
<h6 class="tx-primary">39.948u</h6> | ||
</div> | ||
</div> | ||
<div class="az-list-item"> | ||
<div> | ||
<h6>Nhiệt độ nóng chảy</h6> | ||
</div> | ||
<div> | ||
<h6 class="tx-primary">-189.35°C (83.8 K)</h6> | ||
</div> | ||
</div> | ||
<div class="az-list-item"> | ||
<div> | ||
<h6>Nhiệt độ sôi</h6> | ||
</div> | ||
<div> | ||
<h6 class="tx-primary">-185.85°C (87.3 K)</h6> | ||
</div> | ||
</div> | ||
<div class="az-list-item"> | ||
<div> | ||
<h6>Ngày phát hiện</h6> | ||
</div> | ||
<div> | ||
<h6 class="tx-primary">1894</h6> | ||
</div> | ||
</div> | ||
<div class="az-list-item"> | ||
<div> | ||
<h6>Người phát hiện</h6> | ||
</div> | ||
<div> | ||
<h6 class="tx-primary">John William Strutt, Nam tước Rayleigh thứ 3, William Ramsay</h6> | ||
</div> | ||
</div> | ||
<div class="az-list-item"> | ||
<div> | ||
<h6>Độ âm điện</h6> | ||
</div> | ||
<div> | ||
<h6 class="tx-primary">không ánh xạ</h6> | ||
</div> | ||
</div> | ||
<div class="az-list-item"> | ||
<div> | ||
<h6>Cấu hình electron</h6> | ||
</div> | ||
<div> | ||
<h6 class="tx-primary"> 1s²2s²2p⁶3s²3p⁶</h6> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
|
||
|
||
<!-- mô phỏng 3D --> | ||
<div class="col-lg-8 mg-t-20 mg-lg-t-0"> | ||
<div class="card card-dashboard-four"> | ||
<div class="card-header"> | ||
<h6 class="card-title">Mô hình Bohr 3D</h6> | ||
</div> | ||
<div class="card-body row"> | ||
<div class="col-md 6 d-flex align-items-center"> | ||
<model-viewer src="./ModelView/element_018_argon.glb" alt="A 3D model" auto-rotate camera-controls autoplay="" bounds="tight" camera-controls="" camera-orbit="-0.6751deg 70.99deg 1.4m" exposure="0.3" field-of-view="20deg" max-camera-orbit="auto 180deg 1.4m" min-camera-orbit="auto 0deg auto" data-ved="2ahUKEwiAm5GB1LKFAxVEZ_UHHXc7A3kQsMMIegQIARAC" ar-status="not-presenting"></model-viewer> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
<div > | ||
<h2 class="az-dashboard-title" style="text-align: justify;font-family:times new roman,times,serif; font-size:22px;">2.Tính chất Vật lí</h2> | ||
<p class="card-text" style="text-align: justify;font-family:times new roman,times,serif; font-size:22px;"> - Argon là chất khí, không màu, khó hóa lỏng, có nhiệt độ nóng chảy là -189,350C và sôi ở -185,850C.</p> | ||
</div> | ||
<!-- tính chất hóa học --> | ||
<div id="tinhchathoahoc"> | ||
<h2 class="az-dashboard-title" style="text-align: justify;font-family:times new roman,times,serif; font-size:22px;">3.Tính chất hóa học</h2> | ||
<p class="card-text" style="text-align: justify;font-family:times new roman,times,serif; font-size:22px;"> - Khí hiếm (khí trơ), phi kim, nguyên tố phổ biến nhất trong thiên nhiên của nhóm VIIIA. Không màu. Tan ít trong nước (độ tan giảm khi có mặt chất điện li mạnh), tan nhiều hơn trong dung môi hữu cơ. Tạo nên hợp chất bao 8Ar.46H2O và sonvat Ar.4C6H5OH, Ar.2L (L = HCl, HBr, H2S). Không phản ứng với tất cả các chất khác (đơn chất và hợp chất).</p> | ||
</div> | ||
<!-- ĐIỀU CHẾ --> | ||
<div id="dieuche"> | ||
<h2 class="az-dashboard-title" style="text-align: justify;font-family:times new roman,times,serif; font-size:22px;">4.Điều chế</h2> | ||
<p class="card-text" style=" text-align: justify;font-family:times new roman,times,serif; font-size:22px;">- Argon được cô lập từ không khí lỏng bằng chưng cất phân đoạn do khí quyển Trái Đất, chỉ chứa khoảng 0,934% thể tích.</p> | ||
</div> | ||
|
||
|
||
<!-- ỨNG DỤNG --> | ||
|
||
<div id="ungdung"> | ||
<h2 class="az-dashboard-title" style="text-align: justify;font-family:times new roman,times,serif; font-size:22px;">4. Ứng dụng</h2> | ||
<p class="card-text" style="text-align: justify;font-family:times new roman,times,serif; font-size:22px;"> - Nó được sử dụng trong các loại đèn điện do nó không phản ứng với dây tóc trong bóng đèn ngay cả ở nhiệt độ cao và trong các trường hợp mà nitơ phân tử là một khí bán trơ không ổn định. Các ứng dụng khác:</p> | ||
<p class="card-text" style=" text-align: justify;font-family:times new roman,times,serif; font-size:22px;">+ Argon được sử dụng như là môi trường khí trơ trong nhiều công nghệ hàn kim loại, bao gồm hàn kim loại khí trơ (mig) và hàn vonfram khí trơ (tig).</p> | ||
<p class="card-text" style=" text-align: justify;font-family:times new roman,times,serif; font-size:22px;">+ Có vai trò là lớp phủ không phản ứng trong sản xuất titan và các nguyên tố có phản ứng hóa học cao khác.</p> | ||
<p class="card-text" style=" text-align: justify;font-family:times new roman,times,serif; font-size:22px;">+ Là lớp khí bảo vệ để nuôi cấy các tinh thể silíc và gecmani trong công nghiệp sản xuất chất bán dẫn.</p> | ||
<p class="card-text" style=" text-align: justify;font-family:times new roman,times,serif; font-size:22px;"> + Là chất khí dùng trong các đèn plasma.</p> | ||
<p class="card-text" style=" text-align: justify;font-family:times new roman,times,serif; font-size:22px;"> + Argon39 được sử dụng cho nhiều ứng dụng, chủ yếu là nghiên cứu lõi băng. Nó cũng được dùng để xác định niên đại nước ngầm.</p> | ||
<p class="card-text" style=" text-align: justify;font-family:times new roman,times,serif; font-size:22px;">+ Các thiết bị phẫu thuật lạnh chẳng hạn như sự cắt bỏ lạnh sử dụng argon lỏng để tiêu diệt các tế bào ung thư.</p> | ||
</div> | ||
|
||
</div> | ||
|
||
|
||
|
||
<script src="./styleInfo/lib/jquery/jquery.min.js "></script> | ||
<script src="./styleInfo/lib/bootstrap/js/bootstrap.bundle.min.js"></script> | ||
<script src="./styleInfo/lib/ionicons/ionicons.js"></script> | ||
<script src="./styleInfo/lib/jquery.flot/jquery.flot.js"></script> | ||
<script src="./styleInfo/lib/jquery.flot/jquery.flot.resize.js"></script> | ||
<script src="./styleInfo/lib/chart.js/Chart.bundle.min.js"></script> | ||
<script src="./styleInfo/lib/peity/jquery.peity.min.js"></script> | ||
|
||
<script src="./styleInfo/js/azia.js"></script> | ||
<script src="./styleInfo/js/chart.flot.sampledata.js"></script> | ||
<script src="./styleInfo/js/dashboard.sampledata.js"></script> | ||
<script src="./styleInfo/js/jquery.cookie.js" type="text/javascript"></script> | ||
<script> | ||
$(function(){ | ||
'use strict' | ||
|
||
var plot = $.plot('#flotChart', [{ | ||
data: flotSampleData3, | ||
color: '#007bff', | ||
lines: { | ||
fillColor: { colors: [{ opacity: 0 }, { opacity: 0.2 }]} | ||
} | ||
},{ | ||
data: flotSampleData4, | ||
color: '#560bd0', | ||
lines: { | ||
fillColor: { colors: [{ opacity: 0 }, { opacity: 0.2 }]} | ||
} | ||
}], { | ||
series: { | ||
shadowSize: 0, | ||
lines: { | ||
show: true, | ||
lineWidth: 2, | ||
fill: true | ||
} | ||
}, | ||
grid: { | ||
borderWidth: 0, | ||
labelMargin: 8 | ||
}, | ||
yaxis: { | ||
show: true, | ||
min: 0, | ||
max: 100, | ||
ticks: [[0,''],[20,'20K'],[40,'40K'],[60,'60K'],[80,'80K']], | ||
tickColor: '#eee' | ||
}, | ||
xaxis: { | ||
show: true, | ||
color: '#fff', | ||
ticks: [[25,'OCT 21'],[75,'OCT 22'],[100,'OCT 23'],[125,'OCT 24']], | ||
} | ||
}); | ||
|
||
$.plot('#flotChart1', [{ | ||
data: dashData2, | ||
color: '#00cccc' | ||
}], { | ||
series: { | ||
shadowSize: 0, | ||
lines: { | ||
show: true, | ||
lineWidth: 2, | ||
fill: true, | ||
fillColor: { colors: [ { opacity: 0.2 }, { opacity: 0.2 } ] } | ||
} | ||
}, | ||
grid: { | ||
borderWidth: 0, | ||
labelMargin: 0 | ||
}, | ||
yaxis: { | ||
show: false, | ||
min: 0, | ||
max: 35 | ||
}, | ||
xaxis: { | ||
show: false, | ||
max: 50 | ||
} | ||
}); | ||
|
||
$.plot('#flotChart2', [{ | ||
data: dashData2, | ||
color: '#007bff' | ||
}], { | ||
series: { | ||
shadowSize: 0, | ||
bars: { | ||
show: true, | ||
lineWidth: 0, | ||
fill: 1, | ||
barWidth: .5 | ||
} | ||
}, | ||
grid: { | ||
borderWidth: 0, | ||
labelMargin: 0 | ||
}, | ||
yaxis: { | ||
show: false, | ||
min: 0, | ||
max: 35 | ||
}, | ||
xaxis: { | ||
show: false, | ||
max: 20 | ||
} | ||
}); | ||
|
||
|
||
//-------------------------------------------------------------// | ||
|
||
|
||
// Line chart | ||
$('.peity-line').peity('line'); | ||
|
||
// Bar charts | ||
$('.peity-bar').peity('bar'); | ||
|
||
// Bar charts | ||
$('.peity-donut').peity('donut'); | ||
|
||
var ctx5 = document.getElementById('chartBar5').getContext('2d'); | ||
new Chart(ctx5, { | ||
type: 'bar', | ||
data: { | ||
labels: [0,1,2,3,4,5,6,7], | ||
datasets: [{ | ||
data: [2, 4, 10, 20, 45, 40, 35, 18], | ||
backgroundColor: '#560bd0' | ||
}, { | ||
data: [3, 6, 15, 35, 50, 45, 35, 25], | ||
backgroundColor: '#cad0e8' | ||
}] | ||
}, | ||
options: { | ||
maintainAspectRatio: false, | ||
tooltips: { | ||
enabled: false | ||
}, | ||
legend: { | ||
display: false, | ||
labels: { | ||
display: false | ||
} | ||
}, | ||
scales: { | ||
yAxes: [{ | ||
display: false, | ||
ticks: { | ||
beginAtZero:true, | ||
fontSize: 11, | ||
max: 80 | ||
} | ||
}], | ||
xAxes: [{ | ||
barPercentage: 0.6, | ||
gridLines: { | ||
color: 'rgba(0,0,0,0.08)' | ||
}, | ||
ticks: { | ||
beginAtZero:true, | ||
fontSize: 11, | ||
display: false | ||
} | ||
}] | ||
} | ||
} | ||
}); | ||
|
||
// Donut Chart | ||
var datapie = { | ||
labels: ['Search', 'Email', 'Referral', 'Social', 'Other'], | ||
datasets: [{ | ||
data: [25,20,30,15,10], | ||
backgroundColor: ['#6f42c1', '#007bff','#17a2b8','#00cccc','#adb2bd'] | ||
}] | ||
}; | ||
|
||
var optionpie = { | ||
maintainAspectRatio: false, | ||
responsive: true, | ||
legend: { | ||
display: false, | ||
}, | ||
animation: { | ||
animateScale: true, | ||
animateRotate: true | ||
} | ||
}; | ||
|
||
// For a doughnut chart | ||
var ctxpie= document.getElementById('chartDonut'); | ||
var myPieChart6 = new Chart(ctxpie, { | ||
type: 'doughnut', | ||
data: datapie, | ||
options: optionpie | ||
}); | ||
|
||
}); | ||
</script> | ||
</html> |
Oops, something went wrong.