个人中心
文章发布
退出
作者热门文章
- objective-c - iOS 5 : Can you override UIAppearance customisations in specific classes?
- iphone - 如何将 CGFontRef 转换为 UIFont？
- ios - 以编程方式关闭标记的信息窗口 google maps iOS
- ios - Xcode 5 - 尝试验证存档时出现 "No application records were found"
27
4
Within the Bootstrap CSS project ，为您的标题标签(H1、H2、H3、H4、H5、H6)提供样式，但也有一系列基于标题的类名(.h1、.h2、.h3、.h4、. h5,.h6).在没有正确使用 H1 标签的情况下使用 H1 的类名有什么好处？我认为您总是希望确保您的 HTML 反射(reflect)您的视觉重要性。
任何解释使用 .h1 而不是使用 h1 标签的充分理由的想法都将不胜感激。
最佳答案
你问:
Why use
.h1instead of actualh1?
我们的目标是同时使用两者。
.h* 的用处当设计中排版的大小与语义上适当的标题级别不相关时，类就会发挥作用。通过将问题一分为二，我们可以干净利落地解决这两个问题。
第一位是元素/标签。 ' <h*> ' 负责语义、可访问性和 SEO。
第二位是类。 ' .h* ' 负责视觉语义和打印层次结构。
我相信这些类的起源来自 OOCSS 元素:
自从我上次查看 OOCSS 的最新版本以来，它发生了一些变化，但这里是相关的 heading.css文件，来自较旧的提交，具有 .h1 - .h6我熟悉的类:
6e481bc18f oocss / core / heading / heading.css
来自评论:
.h1-.h6classes should be used to maintain the semantically appropriate heading levels - NOT for use on non-headings
...
if additional headings are needed they should be created via additional classes, never via location dependant styling
注意上面的强调。
有关为什么要使用这些类的详细解释，请参阅:
以上链接的相关引述:
... [HTML5] Section elements are meant to help the browser figure out what level the heading really is, but not necessarily to decide how to style it.
So, how do we style headings in an HTML5 world?
... We shouldn’t use sectioning elements for styling. We should let them do the job they were designed for, which is sorting out the document tree, and solve styling issues another way that meets our goals better: with simple reusable class names that can be applied to any of our headings no matter how deep they may be in the sectioning content.
I recommend abstracting site wide headings into classes because then they are portable, predictable, and dry. You can call them anything you like.
Another absolutely stellar nugget of wisdom [Nicole Sullivan has] given us is what I call double-stranded heading hierarchy. This is the practice of defining a class every time you define a heading in CSS.
... By assigning a class along with each heading style we now have those styles attached to a very flexible selector that can be moved anywhere, rather than to a very specific and non-movable one.
这是一个伪 html5 用法示例 (h/t Jamund Ferguson):
<body>
<div class="main">
<h1>Main Heading</h1>
<section>
<h1 class="h2">Section Header</h1>
</section>
</div>
<aside class="side">
<article class="widget">
<h1 class="h3">Sidebar Headings</h1>
</article>
<article class="widget">
<h1 class="h3">Sidebar Headings</h1>
</article>
</aside>
</body>
请通过上面的链接阅读完整的文章(和线程)，以获取与此问题/主题相关的更多详细信息。
关于html - 为什么使用 .h1 而不是实际的 h1？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/19099401/
27
4
0
我尝试在安装了多类型 MFC 库的 visual studio 2015 MFC 上运行以前编写的 MFC c++ 代码。 但是，我这里仍然有 12 个关于缺少函数的错误: IntelliSense:
我正在学习 OOP 并且有疑问。假设我有一个包含 ClassB.h 的文件 ClassA.h，并且在某些时候我的 ClassB.h 需要包含 ClassA .h。 这会产生一个错误，我想我明白为什么会
我开始使用 CUDA 进行编程，在一些示例中我找到了包含文件 cuda.h、cuda_runtime.h 和 cuda_runtime_api.h 包含在代码中。有人可以向我解释一下这些文件之间的区别
我有一些生成正则表达式的代码。那么下面的表达式实际上是: ^(?:\s*((exclude|include|hide|show|protect|risk|dir-merge|merge)),\s*((
我一直在查看一些源代码，以更好地了解我们使用的这款游戏的核心，并编写更可靠、更快速的插件。然后我发现了这段奇怪的代码...... public void setMaxH(double amount)
通常我们会使用标准类型作为 std::unordered_map 的键和值.但现在我需要自定义我自己的键和值类。 键类在block_cache_key.h 中定义如下: #ifndef BLOCK_C
例如，我想要两个头文件，它们可以依赖于另一个头文件中的函数。 //Header1.h file #include Header2.h void h1(){ //... func1(); } v
我正在研究来自 Sedgewick 的 Shell 排序 Algorithms in C part 1-4在第 172 页。 我使用 size (数组的长度)，而不是 l和 r (开始和结束)；所以我
我在 macOS BigSur 上通过 VMWare 使用 Ubuntu 20.04.2 LTS。我安装了最新版本的 tcl、tcl-dev、tk 和 tk-dev - 版本 8.6。我想编译 Arc
我用我的 glu 和 gl 头文件构建了一个 OpenGL 程序，默认包含在 windows 7 专业版中。现在，我买了一本描述 OpenGL 游戏开发的书。这本书的作者说，我必须在我的项目中包含 g
我想在 token 中保留特殊字符，同时仍对特殊字符进行 token 化。说我有话 "H&R Blocks" 我想将其标记为 "H", "R", "H&R", "Blocks" 我读了http://w
关于 hash 作为 trans 参数的另一个问题。在下面的代码中，简单地使用 hash 会给出不正确的结果，但是将其替换为 keys 和 values 会使其正确。怎么了？ my @alph1 =
我已经编写了一个 C 程序，它获取屏幕像素的 RGB 值 (0-255)，并知道其位置 (x,y)。它可以在 Linux 中运行，但是当我尝试在 Visual Studio (Windows) 中编译
我已经使用 Windows 7 专业版中默认包含的 glu 和 gl 头文件构建了一个 OpenGL 程序。现在，我买了一本描述 OpenGL 游戏开发的书。这本书的作者说，我必须将glew head
#include using namespace std; #include //#include int main() { initscr();
h:messages h:form 内的组件还显示与外部组件相关的消息。 如何限制它只显示与包含 h:form 内的组件相关的消息？ 我不喜欢用单独的h:message来使我的代码膨胀。每个输入组件的
我下载了示例代码和 cpp 文件，其中包含 list.h、queue.h 和 vector.h 等头文件，如果我尝试构建，我会收到“ fatal error :没有这样的文件或目录编译终止”我想我应该
我有一个编译成功的桌面项目，但是在我向项目添加新配置以支持 Windows Mobile 平台后，我收到以下错误: error C2146: syntax error : missing ';' be
有很多关于这个错误的帖子，但我无法解决它，我希望你能拿出解决方案。我在 Ubuntu 机器上。 ~/graphmap2$ 在这个文件夹中，我下载了 zlib。可以看图 经过一番谷歌搜索后，我还注意到没
是否可以在 Visual C++ 中使用以下 header : 图.h dos.h bios.h 最佳答案 据我所知，无法在 Visual C++ 中使用它， 与此同时，我希望您关注 Open Wat
我是一名优秀的程序员,十分优秀！