首页 > 文章 > 前端

LinuxNautilus脚本快速打开HTMLCSS文件

时间：2025-11-25 12:46:39 358浏览收藏

学习知识要善于思考，思考，再思考！今天golang学习网小编就给大家带来《Linux Nautilus脚本一键打开HTMLCSS配对》，以下内容主要包含等知识点，如果你正在学习或准备学习文章，就都不要错过本文啦~让我们一起来看看吧，能帮助到你就更好了！

答案：通过创建Bash脚本并集成到Nautilus右键菜单，可实现一键同时打开同名HTML和CSS文件。1. 脚本检测选中HTML文件是否存在同目录下同名CSS文件；2. 若存在则调用指定编辑器（如VS Code）同时打开两个文件；3. 需将脚本保存至~/.local/share/nautilus/scripts/目录并赋予执行权限；4. 使用时右键点击HTML文件，在“脚本”菜单中选择对应选项即可触发操作。

Linux Nautilus中用脚本一键打开HTML和CSS配对

在 Linux 的 Nautilus 文件管理器中，可以通过自定义脚本实现一键同时打开配对的 HTML 和 CSS 文件。这个功能特别适合前端开发人员，能快速启动关联文件进行编辑。

创建脚本自动识别并打开 HTML/CSS 配对文件

你可以写一个简单的 Bash 脚本，让它检测当前选中的 HTML 文件是否对应同名的 CSS 文件，并用你喜欢的编辑器（如 VS Code、Gedit 或 Sublime Text）同时打开这两个文件。

示例脚本内容如下：

#!/bin/bash
# 获取选中的文件路径（Nautilus 通过 %F 传入）
selected_file="$1"

# 提取文件所在目录和基础名称
dir=$(dirname "$selected_file")
base=$(basename "$selected_file" .html)

# 构造对应的 CSS 文件路径
css_file="$dir/$base.css"

# 检查是否为 HTML 文件且存在同名 CSS 文件
if [[ "$selected_file" == *.html ]] && [[ -f "$css_file" ]]; then
code "$selected_file" "$css_file" # 使用 VS Code 打开
# gedit "$selected_file" "$css_file" # 或使用 Gedit
fi

将脚本添加到 Nautilus 右键菜单

为了让脚本能出现在右键菜单中，需将其保存到 Nautilus 的脚本目录，并设置可执行权限。

步骤如下：

把上面的脚本保存为 open_html_css.sh
创建脚本目录（如果不存在）：
mkdir -p ~/.local/share/nautilus/scripts
移动脚本进去：
mv open_html_css.sh ~/.local/share/nautilus/scripts/
添加执行权限：
chmod +x ~/.local/share/nautilus/scripts/open_html_css.sh

完成后，在 Nautilus 中右键点击任意 HTML 文件，就会在“脚本”子菜单里看到该选项。

使用说明与注意事项

此功能依赖于命名一致性：HTML 和 CSS 文件必须同名（如 index.html 与 index.css），且位于同一目录下。脚本通过扩展名判断类型，因此非标准命名不会触发操作。

你可以根据偏好修改编辑器命令，比如换成 sublime、vim 或其他 GUI 编辑器。确保所用编辑器已安装并支持命令行调用。

每次重启 Nautilus 后脚本会自动加载，若未生效可尝试运行：nautilus -q 来重启文件管理器。

基本上就这些，不复杂但很实用。

终于介绍完啦！小伙伴们，这篇关于《LinuxNautilus脚本快速打开HTMLCSS文件》的介绍应该让你收获多多了吧！欢迎大家收藏或分享给更多需要学习的朋友吧~golang学习网公众号也会发布文章相关知识，快来关注吧！