元素周期表:使用HTML,CSS和JavaScript的元素周期表设计

时间:2024-03-13 22:34:45
【文件属性】:

文件名称:元素周期表:使用HTML,CSS和JavaScript的元素周期表设计

文件大小:107KB

文件格式:ZIP

更新时间:2024-03-13 22:34:45

HTML

•我用于设计元素周期表的语言是HTML,CSS和JavaScript。 •我考虑过使用SASS进行样式设置,但是当我尝试使用CSS和HTML时,单元格的对齐进行得很好,尽管代码有些长,但仍继续使用它。 •可以通过s,p,d,f块区分清楚地看到元素周期表。 •对于鼠标悬停或onclick等鼠标功能,我使用了JavaScript。 该代码比预期的要长,因为每个元素都有一些特定的信息,并且必须显示,所以我声明了每个元素的ID,并为每个元素编写了onmouseover()和onmouseout()的代码。 •有4个名为s,p,d,f的块,在单击它们时会突出显示特定的块,其余的将被禁用,并清除所有这些块以确保所选内容符合原始样式。 •元素上的onmouseover()会导致所有元素的背景变为白色,并显示包含元素信息的表单,并再次显示onmouseout()并隐藏表单以恢复样式。


【文件预览】:
Periodic-Table-master
----fonts()
--------inknut()
----script.js(3KB)
----README.md(1KB)
----style.css(8KB)
----index.html(124KB)
----values.js(149KB)

网友评论