CSS 教程

2023-04-06阅读(439)

本章节为大家介绍响应式 Web 设计框架 Bootstrap。 Bootstrap，来自 Twitter，是目前最受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的，它简洁灵活，使得 Web 开发更加快...

2023-04-06阅读(729)

使用 width 属性 如果 width 属性设置为 100%，视频播放器会根据屏幕大小自动调整比例： 注意在以上实例中，视频播放器根据屏幕大小自动调整比例，且可以比原始尺寸大。更多情况下我们可以使用 max-width 属性来替代。 使用...

2023-04-06阅读(453)

使用 width 属性 如果 width 属性设置为 100%，图片会根据上下范围实现响应式功能： 注意在以上实例中，图片会比它的原始图片大。我们可以使用 max-width 属性很好的解决这个问题。 使用 max-wi...

2023-04-05阅读(359)

媒体(media)查询在 CSS3 上有介绍：CSS3 @media 查询。 使用 @media 查询，你可以针对不同的媒体类型定义不同的样式。 如果浏览器窗口小于 500px, 背景将变为浅蓝色： 添加断点 在先前的教程中我们使用行和列来...

2023-04-05阅读(629)

什么是网格视图? 很多网页都是基于网格设计的，这说明网页是按列来布局的。 使用网格视图有助于我们设计网页。这让我们向网页添加元素变的更简单。 响应式网格视图通常是 12 列，宽度为100%，在浏览器窗口大小调整时会自动伸缩。 响应式网格视图...

2023-04-05阅读(489)

什么是 Viewport? viewport 是用户网页的可视区域。 viewport 翻译为中文可以叫做"视区"。 手机浏览器是把页面放在一个虚拟的"窗口"（viewport）中，通常这个虚拟的"窗口"（viewport）比屏幕宽，这样就...

2023-04-05阅读(415)

什么是响应式 Web 设计? 响应式 Web 设计让你的网页能在所有设备上有好显示。 响应式 Web 设计只使用 HTML 和 CSS。 响应式 Web 设计不是一个程序或Javascript脚本。 设计最好的用户体验 友好的用户体验是网页...

2021-10-30阅读(2601)

CSS 实例 CSS背景 设置页面的背景颜色 设置不同元素的背景颜色 设置一个图像作为页面的背景 错误的背景图片 如何在水平方向重复背景图像 如何定位背景图像 一个固定的背景图片（这个图片不会随页面的其余部分滚动） 声明背景属性 高级的背景...

2021-10-30阅读(774)

本教程已向你讲解了如何创建样式表来同时控制多重页面的样式和布局。 你已经学会如何使用 CSS 来添加背景、格式化文本、以及格式化边框，并定义元素的填充和边距。 同时，你也学会了如何定位元素、控制元素的可见性和尺寸、设置元素的形状、将一个元素...

2021-10-30阅读(1071)

什么是 !important CSS 中的 !important 规则用于增加样式的权重。 !important 与优先级无关，但它与最终的结果直接相关，使用一个 !important 规则时，此声明将覆盖任何其他声明。 以上实例...