<div> <button onclick='previous($id)'><<</button> <button onclick='next($id)'>>></button> </div>可以将按钮位置调整到图片的两侧不？

是的，你可以使用CSS来将按钮调整到图片的两侧。以下是一种可能的方法：

1. 首先，将图片和按钮包装在一个DIV元素内，例如：

<div class="image-container">
  <img src="image.jpg">
  <div class="button-container">
    <button onclick='previous($id)'><<</button>
    <button onclick='next($id)'>>></button>
  </div>
</div>

2. 在CSS中为该DIV元素和其中的元素添加样式，例如：

.image-container {
  position: relative;
}

.image-container img {
  display: block;
  margin: 0 auto;
}

.button-container {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.button-container button {
  display: inline-block;
  margin: 0 10px;
}

这样，按钮就会水平居中并垂直居中于图片的中心位置，左右两个按钮会分别在图片的左侧和右侧。你可以根据需要调整这些样式值，例如更改`top`属性来改变按钮的垂直位置，或者更改`margin`属性来改变按钮之间的间距。

相关问题

echo " <div> <button onclick='previous($id)'><<</button> <button onclick='next($id)'>>></button> </div> <script> function previous(currentId) { window.location.href = 'navigate.php?subcategory=$subcategoryId&id=' + (currentId - 1); } function next(currentId) { window.location.href = 'navigate.php?subcategory=$subcategoryId&id=' + (currentId + 1); } </script> ";这写的是什么

这是一个PHP字符串，其中包含HTML代码和JavaScript代码。它生成一个包含左右箭头按钮的DIV，当点击左右箭头按钮时，会调用JavaScript函数previous和next来更新页面URL，实现在同一子类别下浏览不同文章的功能。其中，$id和$subcategoryId是PHP变量，通过字符串插值的方式嵌入到了HTML和JavaScript代码中。

php读取redsources_db数据库的red_resources；数据库账号为root，密码为Aa123456。red_resources表头内容为id，category_id，subcategory_id，details，image。 根据数据库动态创建以下内容： 第一个php文件： 需求1：接受外部传入的$subcategoryId = $_GET['subcategory']; 需求2：默认显示满足$subcategoryId条件的第一条信息, $subcategoryId为字符串； 需求3：将表格table中image的内容，使用$image_data = base64_encode(file_get_contents($image))方法将图片显示出来。 需求4：在显示图片的左右，添加导览按钮，点击“<<”显示满足$subcategoryId的前一个信息，点击“>>”显示满足$subcategoryId的后一个信息。 请用一个php文件给出完整代码

以下是可供参考的代码：

<?php
// 设置数据库连接信息
$servername = "localhost";
$username = "root";
$password = "Aa123456";
$dbname = "redsources_db";

// 创建数据库连接
$conn = new mysqli($servername, $username, $password, $dbname);

// 检查数据库连接是否成功
if ($conn->connect_error) {
    die("数据库连接失败: " . $conn->connect_error);
}

// 获取子分类ID
$subcategoryId = $_GET['subcategory'];

// 查询满足条件的第一条信息
$sql = "SELECT * FROM red_resources WHERE subcategory_id = '$subcategoryId' LIMIT 1";
$result = $conn->query($sql);

// 检查是否有结果
if ($result->num_rows > 0) {
    // 输出数据
    $row = $result->fetch_assoc();
    $id = $row["id"];
    $categoryId = $row["category_id"];
    $subcategory_id = $row["subcategory_id"];
    $details = $row["details"];
    $image = $row["image"];
    $image_data = base64_encode(file_get_contents($image));
    echo "
        <table>
            <tr>
                <td><img src='data:image/jpeg;base64,$image_data' width='300' height='200'></td>
                <td>
                    <h2>ID: $id</h2>
                    <h3>Category ID: $categoryId</h3>
                    <h3>Subcategory ID: $subcategory_id</h3>
                    <p>$details</p>
                </td>
            </tr>
        </table>
        <div>
            <button onclick='previous($id)'><<</button>
            <button onclick='next($id)'>>></button>
        </div>
        <script>
            function previous(currentId) {
                window.location.href = 'navigate.php?subcategory=$subcategoryId&id=' + (currentId - 1);
            }
            function next(currentId) {
                window.location.href = 'navigate.php?subcategory=$subcategoryId&id=' + (currentId + 1);
            }
        </script>
    ";
} else {
    echo "没有找到符合条件的信息。";
}

// 关闭数据库连接
$conn->close();
?>

以上代码实现了以下功能：

1. 获取子分类ID。
2. 查询满足条件的第一条信息，并将图片转换为Base64编码后显示。
3. 在图片左右分别添加“<<”和“>>”按钮，点击可以导航到上一条或下一条信息。
4. 通过JavaScript实现导航功能，将当前信息的ID作为参数传递给另一个PHP文件。

你可以将以上代码保存为一个PHP文件，例如“navigate.php”，并将其放置在Web服务器的根目录下。然后，在浏览器中输入以下URL，即可访问该文件并查看效果：

http://localhost/navigate.php?subcategory=xxx

其中，“xxx”是你想要查看的子分类ID。