<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Food Recipe Finder</title>
<!-- Style CSS -->
<link rel="stylesheet" href="./style.css">
</head>
<body>
<div class="main">
<h1>Food Recipe Finder</h1>
<div class="search">
<div class="search-box">
<div class="search-field">
<input placeholder="Search food or ingredients..." class="input" type="text" id="searchInput">
<div class="search-box-icon">
<button class="btn-icon-content" id="searchButton">
<i class="search-icon">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 512 512">
<path d="M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z" fill="#fff"></path>
</svg>
</i>
</button>
</div>
</div>
</div>
</div>
<div class="recipe-result">
<ul id="results"></ul>
</div>
</div>
<script src="./script.js"></script>
</body>
</html>
没有合适的资源?快使用搜索试试~ 我知道了~
Food Recipe Finde.zip
共3个文件
html:1个
js:1个
css:1个
0 下载量 111 浏览量
2023-11-08
19:43:11
上传
评论
收藏 3KB ZIP 举报
温馨提示
JavaScript
资源推荐
资源详情
资源评论
收起资源包目录
Food Recipe Finder Using HTML, CSS and JavaScript with Source Code.zip (3个子文件)
food-recipe-finder
style.css 3KB
index.html 1KB
script.js 1KB
共 3 条
- 1
资源评论
sanbaofengs
- 粉丝: 507
- 资源: 711
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功