Discuz! Board

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 71|回复: 0

我会制作一个故事板来决定如何随着屏幕尺

[复制链接]

1

主题

1

帖子

5

积分

新手上路

Rank: 1

积分
5
发表于 2023-9-9 19:46:11 | 显示全部楼层 |阅读模式
寸的变化重新排列元素。对于中型屏幕,我将四个元素排列在 2x2 对称柱网格中。通过使用 minmax 值来调整这些列的大小,我确保它们填充所有可用空间,但它们的宽度永远不会收缩到 400px 以下:  复制 对于更大的屏幕,我还需要两行。它们的高度应该相等并占据所有可用的垂直空间} 复制 一个大的、水平滚动的内容区域在这个设计中占主导地位,并且比视口更宽。该面板包括四列 - 三列用于图像,一列用于我的雕刻副本 - 每列的宽度至少为 400 像素。通过设置视口的最大宽度并仅允许在水平轴上滚动,视口之外的任何内容都会被隐藏,WhatsApp 数据库   但仍然可以访问: } 复制 一个表现分区,代表我的甲壳虫形状车轮下的道路。

一个表现分区,代表我的甲壳虫形状车轮下的道路。(大预览) 我的内容下方是一个演示部分,代表我的甲壳虫形状车轮下的道路。该元素在较小的屏幕尺寸上不可见,因此为了使其可见,我将显示属性从无更改为块,然后添加浅灰色背景颜色。我之前在 body 元素上设置的网格属性定义了该划分的高度: div { display: block; background-color: #a73448; } } 复制 Webkit 的 Dave Hyatt 早在 2008 年就最初提出了 CSS Reflections,但到目前为止它们还没有在其他浏览器渲染引擎中实现。目前仅 Google Chrome 支持 CSS 反射。 正如您可能想象的那样,反射创建元素的副本。倒影可以出现在上方、下方、左侧或右侧。就像在物理世界中一样,当一个元素以某种方式发生变化时,它的反射也会随之发生。 CSS Reflections 提供了三个实验属性。它的方向和可选的偏移量控制元素与其反射之间的距离。

您还可以对任何反射应用遮罩以更改其外观,例如,使用渐变遮罩逐渐淡化在《灵感设计决策》的第七部分中,安迪·克拉克将探讨美国艺术总监兼平面设计师奥托·斯托奇如何激发他的网络设计灵感。我们如何使用 CSS Shapes 超越基本形状,为我们的设计增添活力?我们如何使用文本旋转来产生额外的效果?我们如何使用镜像和反射来增加设计的趣味性?在本文中,我们将对此进行探讨。 在过去的几年里,有关 HTML 和 CSS 的书籍几乎从我工作室的书架上消失了。我用有关艺术指导、编辑和平面设计的书籍取代了它们。 最近,我正在浏览图书馆的新内容,并被一本杂志所吸引。我喜欢它的设计师将图像和版式有趣地结合起来,创造出充满活力和动感的设计。


您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

手机版|小黑屋|DiscuzX

GMT+8, 2024-11-24 19:41 , Processed in 0.029886 second(s), 18 queries .

Powered by Discuz! X3.4

Copyright © 2001-2020, Tencent Cloud.

快速回复 返回顶部 返回列表