有没有办法从单个页面导出 CSS 和 HTML 代码?

问题描述 投票:0回答:3

你好开发者我需要帮助,谢谢 有没有办法从单个页面导出 CSS 和 HTML 代码?

php html css wordpress
3个回答
1
投票

在 Chrome 中,单击文件 --> 将页面另存为(在 Mac 上为 command + s 或在 pc 上为 control + s)。


0
投票

在页面源码中可以看到html代码。 导出它们只需简单的复制和粘贴。

CSS可以通过点击element中的链接查看,还有js:

<link rel="stylesheet" href="link_to_css">

您也可以单击鼠标右键,然后另存为。


0
投票

我认为你的意思是从 html 中“提取”拆分的 css/js 资源(而不是“导出”)。奇怪的是,没有人回答如此重要的网络行业问题。

通常,很多老师告诉你必须用eslint,或者jscs,或者sonarqube,或者markup validator w3,或者一些vacuum-ideal流行框架,自己动手构建html+js+css。但是在现实生活中,您经常从草稿(MVP)开始项目,并在最近对其进行优化,因此您需要类似于逆向工程的工具来为您自己的 Web 项目...

这样的工具可以让你避免对其他程序员进行大量的技术解释,将你的网络项目(前端部分)重构为可读的干净格式,例如从 html/php 中提取 css/js。

  1. TexAu 可以从您的网站(从您主机上的 HTML)中提取 CSS 和 JavaScript。

    • 创建一个免费的 TexAu 帐户。
    • 列出要自动点赞的个人资料网址。
    • 立即运行自动化(并安排它)。
  2. SnipCSS 扩展 提取与 HTML 网页的任何部分关联的所有 CSS 样式(借助 Chrome DevTools 协议)。

  3. Extract critical css 提取首屏内容的 CSS,以便尽快向用户呈现内容(以加快速度为目标)。

  4. Webpack js 迷你 css 提取插件 提取成 JS+CSS 对(用于 webpack 世界)。

  5. 在 Chrome 中保存渲染的 HTML 页面 Ctrl + S。它通常允许单独拆分一些资源(CSS、JS、FONT、IMG)。

  6. 使用 Chrome 标准浏览器控制台和元素检查器。在控制台上,您可以看到 document.styleSheets 对象值以了解外部 CSS 文件名。

  7. Figma 导出到 html 插件 如果您来自 Figma 世界而不是 Web 世界,可以帮助您。

  8. 将 wp 页面导出为静态 html 如果您来自 Wordpress 世界而不是 Web 现实世界,则可以帮助您。

  9. 借助 PHP(CSS,来自源 HTML)提取内联和外部样式:从 html 中提取 css

  10. Extract styles with help of Perl (CSS, from source HTML): Extract style tag data using Perl

  11. Extract CSS styles with help of Java JSoup HTML parser (from source HTML): Extract CSS Styles from HTML using JSOUP in JAVA

  12. 使用 Softdrink Lisp 从 HTML 中提取 CSS 样式。极端的方式。

  13. HTTrack Website Copier 有助于准备您网站的镜像,其中已经包含一些与 HTML 分离的 CSS 样式。但是,如果没有,您可以稍后在上传到其他主机/本地主机后使用其他方法。如果您的 MVP(草稿)使用不受欢迎的 CMS,这将很有用。

© www.soinside.com 2019 - 2024. All rights reserved.