什么是 css“设计模式”的良好在线资源? [关闭]

2024-04-23

有人可以推荐一个关于 CSS“设计模式”的优秀在线资源吗?

我知道软件上下文中的设计模式通常指的是基于 OO 的设计模式,但我指的是更广泛意义上的设计模式:即常见问题/任务的通用、干净的解决方案。

这种资源的一个例子是这个桌子设计列表 http://www.smashingmagazine.com/2008/08/13/top-10-css-table-designs/,这为您提供了有关如何使用一组 CSS 技术使表格看起来漂亮的真正需要了解的一切。

其他可以有很好的解决方案的常见问题的例子包括 div 上的圆角、高度可用的表单布局等。


下面列出了一些解决网页设计模式的网站。他们没有专门提供 HTML 和/或 CSS 来实现所需的结果,但他们确实提供了实时网站的示例,您可以查看源代码上(或者更好的是,使用Firebug http://getfirebug.com/).

UI模式 http://ui-patterns.com/

这可能是这群中最好的。它将事物分解为涵盖网页设计任务范围的类别。您会发现标签云、实时预览和用户注册等类别。这是一个组织良好、非常全面的资源。它解释了每种模式并提供了大量示例。

图案水龙头 http://patterntap.com/

与 UI 模式类似,但目前不那么全面。它采用一种更加社交化的方法来整理设计模式,允许用户创建自己的类别(“用户集”)并用自己选择的网站填充它们。

雅虎设计模式库 http://developer.yahoo.com/ypatterns/

与其他两个不同,这个没有提供很多真实站点的示例。它组织得很好而且相当全面。

设计要素 http://www.smileycat.com/design_elements/

这是一个展示网页设计各种元素的博客。它不讨论模式,但可以作为快速的灵感来源,或者作为开始您自己的分析的手段。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

什么是 css“设计模式”的良好在线资源? [关闭] 的相关文章

  • 绝对元素后面元素上的文本选择

    我有一个覆盖元素 它隐藏了其他包含文本的 div 覆盖元素是绝对定位的 我希望用户能够选择这些 div 后面的文本 我的解决方案是隐藏用户事件 mouseDown 上的覆盖层 显示 无 并在 mouseUp 事件发生时再次显示它 这样 一旦
  • 在浏览器中覆盖 TAB

    如果我在输入字段中输入文本并按ENTER我所知道的所有浏览器的默认行为是提交表单 但是如果我按ENTER在文本区域内添加新行 每当我按下时 有什么方法可以模仿这种行为 缩进 而不是提交表单 TAB在文本区域内 Bespin https be
  • 元标记内的属性 property="og:title" 是什么?

    我有网站源代码的摘录 这是做什么的属性属性代表什么 其目的是什么 og title是开放图元标签之一 og 属性定义社交图中的对象 例如 Facebook 使用它们 og title代表对象的标题 因为它应该出现在图表中 请参阅此处了解更多
  • 自动更改时 onChange 事件不起作用

    我在一个选择框 usageDisplays 上有一个 onChange 事件 它根据第一个选择框的选定值填充下一个选择框
  • 获取动态图像的宽度和高度

    我有一个img嵌入隐藏标签内div 当用户单击具有图像名称的动态超链接时 图像必须显示在模式窗口中 为了将 div 定位在模态窗口内 需要图像高度 但是当点击超链接后 src被分配 高度为0 所以图像不能在中间对齐 请帮助我在浏览器中显示图
  • 如何删除垂直滚动条 SyntaxHighlighter 块?

    我是网络开发的新手 可能有一个主要问题 我已经在我的网站上安装了 Joomla 2 5 CMS 下载 安装并打开语法荧光笔 http alexgorbatchev com SyntaxHighlighter 插入 然后启用bash语法并在我
  • 生成的表的行跨度导致额外的单元格

    HTML table border 1 cellspacing 1 width 100 thead tr td class csstextheader width 70px td td class csstextheader width 7
  • jQuery 无法在外部 JavaScript 中工作

    我是 jQuery 新手 遇到了一些奇怪的问题 我正在使用 jQuery 的change and click方法 在我的 HTML 文件中使用时它们工作正常
  • Firefox(仅限)动态表单操作不起作用

    控制台为操作属性返回空白 我已经移动了 file upload attr action io cfm action updateitemfile item id agenda modal attr data defaultitemid 周围
  • 有什么特别好的理由在 javascript 目标链接上继续使用 href='#' 吗?

    众所周知 像这样的代码是非常常见的 a href class edit Edit a 然后将其连接到事件处理程序 使用 jQuery 或当今流行的任何东西 甚至使用内联 js 处理程序 a href Edit a 我知道这是在链接上显示指针
  • 使用 jQuery 对 CSS 变换进行动画处理

    我正在尝试为 div 制作动画 并让它绕 y 轴旋转 180 度 当我调用以下代码时 出现 jQuery 错误 my div animate transform rotateY 180deg webkit transform rotateY
  • document.registerElement - 为什么我们需要指定“prototype”和“extends”?

    考虑我想扩展本地button元素 并创建我自己的super button元素 据我所知 它必须遵循以下模式 var SuperButton document registerElement super button prototype Ob
  • 为什么有人将(Apache mod_expires 参数)ExpiresByType 设置为“访问加 0 秒”?

    在审查答案时这个帖子 https stackoverflow com questions 9933012 how to use mod headers and mod expires to cache 我不明白为什么这里使用 0 秒作为最佳
  • 在 JavaScript 中引用 C# 变量

    我已经阅读了很多线程 但我不明白为什么这不起作用 我正在创建一个将用作导航栏的 SharePoint Web 部件 一切都很顺利 直到我尝试在 JS 代码中引用 C 变量 这是来自 VisualWebPart1UserControl asc
  • 将水平线添加到 html rmarkdown 文档隐藏文本部分

    我正在制作一个与 HTML 页面结合的 Rmarkdown 文档 我不想用标题或项目符号分隔某些文本部分 而是想在它们之间绘制水平线 根据http rmarkdown rstudio com authoring basics html ht
  • 为什么-标签没有关闭

    这是一个普遍问题 我的教授都无法回答 为什么我不必关闭 HTML 中的标签 所有其他标签都必须关闭 例如 or 那么为什么不呢 首先 它根本不是一个标签 在名义上基于 SGML 或 XML 的 HTML 版本中 它是文件类型声明 它具有在
  • HTML5 画布将颜色应用于形状重叠的图像

    我将此图像绘制到 HTML5 画布上 我想做的就是只给它的一部分应用颜色 我想要应用颜色的部分由以下覆盖图像定义 所以 基本上 我想通过叠加来指导我的着色 因此 在覆盖像素与主图像像素相遇的地方 我应该在主图像上应用颜色 至少我认为它是这样
  • html 下钻下拉所选值未插入 MYSQL

    我有两个下拉列表 首先从数据库下拉填充 根据第一个下拉列表的选定值从数据库填充第二个下拉列表 document ready function c change function var c1 c selected text if c1 aj
  • jQuery - 动画CSS背景大小?

    我正在尝试对背景图像的大小进行动画处理 但它不起作用 从以下代码中知道为什么吗 this animate opacity 1 background size 70px 48px right 39 top 45 250 注意 所有其他属性都可
  • 使用命令行将 MediaWiki 维基文本格式转换为 HTML

    我倾向于编写大量文档 因此 MediaWiki 格式对我来说很容易理解 而且比编写传统 HTML 节省了我很多时间 然而 我也写了一篇博客 发现一直从键盘切换到鼠标来输入正确的 HTML 标签会增加很多时间 我希望能够使用 Mediawik

随机推荐