CSS 变量CSS 变量var() 函数用于插入 CSS 变量的值。CSS 变量可以访问 DOM,这意味着您可以创建具有局部或全局范围的变量,使用 JavaScript 来修改变量,以及基于媒体查询来修改
CSS 用户界面CSS 用户界面在本章中,您将学到以下 CSS 用户界面属性: resize outline-offset浏览器支持表格中的数字注明了完全支持该属性的首个浏览器版本。 属性 Chro
CSS 多列CSS 多列布局.newspaper { xborder:1px black solid; padding: 15px; -webkit-column-count: 3; /* Chrome, Safari, Opera */ -moz-column-count: 3; /* F
CSS 分页实例学习如何使用 CSS 创建响应式分页。简单的分页如果网站上有很多页面,那么您可能希望在每张页面上添加某种分页功能:div#maincontent ul.pagination, div#maincont
CSS 按钮学习如何使用 CSS 设置按钮样式。基本按钮样式.btn {background-color: #4CAF50;border: none;color: #FFFFFF;padding: 15px 32px;text-align: center;-webkit-tra
CSS object-fit 属性CSS object-fit 属性用于规定应如何调整 <img> 或 <video> 的大小来适应其容器。浏览器支持表格中的数字注明了完全支持该属性的首个浏览器版本。
CSS 图像样式学习如何使用 CSS 设置图像样式。圆角图像使用 border-radius 属性创建圆形图像:.p50 {padding: 10px;}div#maincontent div.p50 { width: 50%; box-sizin
CSS 工具提示通过 CSS 创建工具提示(Tooltip)。演示:工具提示示例代码:当用户将鼠标指针移到元素上时,工具提示通常用于提供关于某内容的额外信息:.p100 {margin-top: 30px;margin
CSS 动画CSS 动画CSS 可实现 HTML 元素的动画效果,而不使用 JavaScript 或 Flash!#animated_div {width:70px;height:47px;background: #92B901;color: #ffffff;position: rel
CSS 过渡CSS 过渡CSS 过渡允许您在给定的时间内平滑地改变属性值。请把鼠标移动到这个元素上,来查看 CSS 过渡效果:.animated_div { width:60px; height:40px; background:#92
CSS 3D 转换CSS 3D 转换CSS 还支持 3D 转换。请将鼠标悬停在下面的元素上,即可查看 2D 和 3D 转换之间的区别:#rotate2D,#rotate3D { width: 80px; height: 70px; co
CSS 2D 转换CSS 2D 转换CSS 转换(transforms)允许您移动、旋转、缩放和倾斜元素。把鼠标悬停在下面的元素上,可以查看 2D 转换:#rotate2D { width:80px; height:70px;
CSS Web 字体CSS @font-face 规则Web 字体允许 Web 设计人员使用用户计算机上未安装的字体。当您找到/购买了想要使用的字体后,只需将字体文件包含在您的 Web 服务器上,它将在
CSS 文本效果CSS 文本溢出、整字换行、换行规则以及书写模式在本章中,您将学习如下属性: text-overflow word-wrap word-break writing-modeCSS 文字溢出CSS text-overflow 属
CSS Box ShadowCSS box-shadow 属性CSS box-shadow 属性应用阴影于元素。最简单的用法是只指定水平阴影和垂直阴影:#boxshadow1 { width: 300px; height: 100px; pa