这款软件呢是一款专门写HTML和专门运行HTML的一款工具

虽然之前我分享过一款 HTML 的工具

但那款工具是需要花钱的而且不花钱就不支持分享

而且他分享完以后只能在浏览器查看不能变成一款软件

只能用类似于网页打包和一些可以打包网页的软件来把它变成一款软件

这样就很麻烦

于是我找了半天终于找到了一款大家适合的软件

虽然这款软件是需要会员的但是不用会员也可以编辑代码运行代码复制代码打包代码

非常的好用

里面还内置了HTML代码教学如果不会写的可以看教学

如果实在学不会也没有关系我们可以用Deep Seek和豆包辅助帮我们写

如果会写的小伙伴可以自己动手练习练习

下面来看一个 HTML 代码

苹果风格计算器

*{margin:0;padding:0;box-sizing:border-box;}

body{

background:#f5f5f7;

display:flex;

justify-content:center;

align-items:center;

min-height:100vh;

}

/* 苹果计算器外壳 */

.calc{

width:320px;

background:#1c1c1e;

border-radius:40px;

padding:20px;

box-shadow:0 10px 30px #00000033;

}

/* 显示屏幕 */

#screen{

width:100%;

height:120px;

background:transparent;

border:none;

text-align:right;

font-size:48px;

color:#fff;

padding:20px 10px;

margin-bottom:10px;

pointer-events:none;

}

/* 按钮网格 */

.btn-box{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:12px;

}

/* 通用按钮 */

button{

height:65px;

border-radius:50%;

border:none;

font-size:22px;

cursor:pointer;

transition:0.2s;

}

/* 灰色功能键 */

.btn-gray{background:#a5a5a5;color:#000;}

/* 橙色运算键 */

.btn-orange{background:#ff9f0a;color:#fff;}

/* 黑色数字键 */

.btn-dark{background:#333333;color:#fff;}

/* 0号按钮加宽 */

.zero{grid-column:span 2;border-radius:35px;}

button:active{opacity:0.7;}

AC

±

%

÷

7

8

9

×

4

5

6

-

1

2

3

+

0

.

=

let screen = document.getElementById('screen');

// 输入按键

function inputBtn(val){

if(screen.value === '0'){

screen.value = '';

}

screen.value += val;

}

// 清空

function clearAll(){

screen.value = '0';

}

// 计算结果

function calcResult(){

try{

let res = eval(screen.value.replace(/×/g,'*'));

screen.value = res;

}catch{

screen.value = '错误';

}

}

这个就是我用豆包生成的

这时有人就该问了说了半天软件的安装包搁哪呢

下面就发安装包的链接

如果大家有什么好用的写HTML代码的软件都可以在下面分享一下

好的今天的分享就到这里