2024年3月1日

Html: HTML favicon ico 尺寸 格式 制作等相关知识详细介绍

本文大部分内容源自这个stackoverflow问题的最高赞回答,然后结合其他一些favicon的知识整理而成。 favicon是Favorites Icon的缩写,通常是一个ico图标,显示在浏览器标签页标题前,也用于地址栏,书签以及快捷方式图标,使用网站LOGO图标能够从视觉上直观区别不同的网站。 一、favicon的格式 favicon通常使用下面这几种文件格式: favicon.ico图标 PNG格式图标 favicon.ico类型的图标所有桌面浏览器都支持,包括旧版本的IE浏览器。 PNG格式的图标现代桌面浏览器(如IE11,Chrome,Firefox)都支持。 为了在跨桌面浏览器(Windows/IE, MacOS/Safari等)的时候有最好的效果,建议结合这两种类型的图标。 二、favicon的尺寸 favicon必…
2024年2月1日

Html: Chrome / Firefox 扩展 提取 XPath 表达式 或 CSS 选择器的查询结果

Chrome XPath Helper Extract, edit, and evaluate XPath queries with ease. SelectorsHub xPath plugin to auto generate, write and verify xpath & cssSelector. Firefox XPath Helper for developer Extract, edit, and evaluate XPath queries with ease. Try XPath This add-on displays the result of evaluating XPath expression or CSS selector. ChroPath ChroPath helps to generate and validate selectors like relative xpath, cssS…
2024年1月30日

Html: CSS 选择器

CSS 选择器 MDN Web Docs: https://developer.mozilla.org/zh-CN/docs/Learn/CSS/Building_blocks/Selectors 查看汇总表 CSS中,选择器用来指定网页上我们想要样式化的HTML元素。有 CSS 选择器提供了很多种方法,所以在选择要样式化的元素时,我们可以做到很精细的地步。本文和本文的子篇中,我们将会详细地讲授选择器的不同使用方式,并了解它们的工作原理。 学习前提: 计算机的基本知识, 安装了基础软件,处理文件的基本知识,HTML 基础(学习HTML 介绍)以及对 CSS 工作方式的了解(学习CSS 初步) 目标: 详细学习 CSS 选择器的工作方式。 选择器是什么? 你也许已经见过选择器了。CSS 选择器是 CSS 规则的第一部分。它是元素和其他部分组合起来告诉浏览器哪个 HT…
2024年1月21日

Html: HTML和XML里的语言标签 zh-CN zh-Hans

问题 哪种语言标签适合我?如何选择语言和其他子标签? 在HTML和XML里,语言标签用于指示内容的语言。 语言标签由一个或多个用连字符分隔的子标签组成。子标签有多种类型。 BCP代表“当前的最佳实践”(Best Current Practice),是一系列RFC的永久名称,这些RFC的编号可能会更新。描述语言标签语法的最新RFC是RFC 5646,《用于识别语言的标签》(Tags for Identifying Languages),该版本废弃了较旧的RFC 4646、3066和1766。 语言标签语法由IETF的BCP 47定义。过去你需要查阅各种ISO标准中的代码列表才能找到正确的子标签,而现在只需查看IANA语言子标签注册中心即可。下面我们会描述新的语言子标签注册中心。 本文提供了如何选择语言标签的建议。有关BCP 47中定义的概念的…
2023年10月20日

Html: CSS 字体单位:px、em、rem 和 %

对于绘图和印刷而言,「单位」很相当重要的,然而在网页排版里,单位也是同样具有重要性,在 CSS3 普及以来,更支持了一些方便好用的单位 ( px、em、rem...等 ),这篇文章将整理这些常用的 CSS 单位,也帮助自己未来在使用上能更加得心应手。 「网页」和「印刷」的单位 若要把单位做区隔,最简单可以分为「网页」和「印刷」两大类,通常对于 CSS 来说只会应用到网页的样式,毕竟真正要做印刷,还是会倾向透过排版软件来进行设计。 网页 ( 单位 ) px:绝对单位,代表屏幕中每个「点」( pixel )。 em:相对单位,每个子元素透过「倍数」乘以父元素的 px 值。 rem:相对单位,每个元素透过「倍数」乘以根元素的 px 值。 %:相对单位,每个子元素透过「百分比」乘以父元素的 px 值。 网页 ( 属性名称 ) medium:默认值,等于 16px ( h4 默认值 ) xx-s…
2023年10月8日

Html: XPath 教程

XPath 教程 目录 XPath 教程 XPath 简介 XPath 节点 XPath 语法 XPath Axes(轴) XPath 运算符 XPath 实例 XPath 函数 XPath、XQuery 以及 XSLT 函数 XPath 简介 XPath 是一门在 XML 文档中查找信息的语言。XPath 可用来在 XML 文档中对元素和属性进行遍历。 XPath 是 W3C XSLT 标准的主要元素,并且 XQuery 和 XPointer 都构建于 XPath 表达之上。 因此,对 XPath 的理解是很多高级 XML 应用的基础。 在学习之前应该具备的知识: 在您继续学习之前,应该对下面的知识有基本的了解: HTML / XHTML XML / XML 命名空间 什么是 XPath? XPath 使用路径表达式在 XML 文档中进行导航 XPath 包含一个标准函数库 XPath 是 XSLT 中的主要元素 XPath 是一个 W3C 标准 XP…
2023年10月7日

Html: HTML5 基本模板 样板文件 HTML 5 boilerplate

HTML 5 样板代码示例 我们看一下这个基本的示例。 <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>HTML5 基本模板</title> <link rel="stylesheet" href="style.css"> </head> <body> <script src="index.…
2023年9月10日

Html: SVG教程

https://flaviocopes.com/svg/ SVG 是优秀且令人难以置信的强大图像格式。本教程通过简单地解释所有需要了解的知识,为您提供 SVG 的概述。 介绍 尽管在 21 世纪初被标准化了,SVG(Scalable Vector Graphics 的缩写)是近年来的一个热门话题。 SVG 已经被糟糕的浏览器支持(尤其是 IE)惩罚了好多年。 我发现这话源自一本 2011 的书:在撰写本文时,只有在最新的浏览器中才能将 SVG 直接嵌入到 HTML 中工作。7 年过去了,这句话现在已经是过去式了,我们可以很安全地使用 SVG 图像。 现在我们可以安全地使用 SVG 图像,除非您有很多用户使用 IE8 以及更低版本,或者使用较旧的 Android 设备。这种情况下,依然存在着备选方案。 SVG 成功的一部分是由于我们必须支持各种不同分辨率和尺寸的屏幕显示。SVG…
2023年9月5日

Html: 网页字体大小

对于很多网页设计师来说,很习惯的使用某一字体大小,比如14px或12px。有时候我们设计网页时并不会十分仔细的考虑字体大小的选择,因为在国内网站来说12px和14px基本成了所有网页字体的标准大小,但在这个显示器百花齐放的时代,网页设计师往往需要考虑不同客户端的浏览体验,所以研究字体和浏览器之间的关系还是有些必要的。至少可以让我们从更深层面认识我们为何要使用这种大小的字体! 文字大小,是用户体验中的一个重要部分。不同的分辨率,不同的显示器尺寸,不同的DPI,乃至不同的浏览器设置,都会对最终展现的文字大小带来影响。虽然现在很多浏览器已经可以方便地缩放页面,但用户每次光临都要重新缩放,总归麻烦,何况还有许多用户不知道如何缩放页面。最好还是根据用户的分辨率给用户一个比较体贴的默认字号,那这个字号多大合适呢? 12px?1…
2023年8月26日

Markdown 基本语法

Markdown是一种纯文本格式的标记语言。通过简单的标记语法,它可以使普通文本内容具有一定的格式。 一、标题 在想要设置为标题的文字前面加#来表示 一个#是一级标题,二个#是二级标题,以此类推。支持六级标题。 注:标准语法一般在#后跟个空格再写文字。 示例: # 这是一级标题 ## 这是二级标题 ### 这是三级标题 #### 这是四级标题 ##### 这是五级标题 ###### 这是六级标题 效果如下: 这是一级标题 这是二级标题 这是三级标题 这是四级标题 这是五级标题 这是六级标题 二、字体 加粗 要加粗的文字左右分别用两个*号包起来 斜体 要倾斜的文字左右分别用一个*号包起来 斜体加粗 要倾斜和加粗的文字左右分别用三个*号包起来 删除线 要加删除线的文字左右分别用两个~~号包起来 示例: **这是加粗的文字** *这是倾斜的文字*` ***这是斜体加粗的文字*** ~~这是加…