找到 1575 篇文章 适用于 CSS
156 次浏览
azimuth 属性设置声音应从水平方向的哪个位置发出。可能的取值如下:angle − 位置用 -360deg 到 360deg 范围内的角度表示。值 0deg 表示声音舞台中心的正前方。90deg 表示右侧,180deg 表示后方,270deg(或等效且更方便地,-90deg)表示左侧。left-side − 与 '270deg' 相同。与 'behind'、'270deg' 相同。far-left − 与 '300deg' 相同。与 'behind'、'240deg' 相同。left − 与 '320deg' 相同。与 'behind'、'220deg' 相同。center-left − 与 '340deg' 相同。与 'behind'、'200deg' 相同。center − 与 '0deg' 相同。与 'behind'、'180deg' 相同。center-right − 与 ... 阅读更多
178 次浏览
在排版术语中,孤行是指由于分页导致的段落中遗留在页面底部的行,而寡行是指分页后遗留在页面顶部的行。通常,打印页面上出现单独一行文本遗留在顶部或底部看起来并不美观。大多数打印机都会尝试在每个页面的顶部或底部至少保留两行或更多行文本。orphans 属性指定必须留在页面底部的段落行的最小数量。widow's 属性 ... 阅读更多
334 次浏览
要控制分页,请使用 page-break-before、page-break-after 和 page-break-inside 属性。page-break-before 和 page-break-after 都接受 auto、always、avoid、left 和 right 关键字。关键字 auto 是默认值;它允许浏览器根据需要生成分页符。关键字 always 强制在元素之前或之后进行分页,而 avoid 则抑制元素之前或之后的分页。left 和 right 关键字强制进行一到两次分页,以便元素呈现于左侧或右侧页面上。使用分页属性非常简单。假设您的文档的 1 级标题以新章节开头,使用 2 级标题表示部分。 ... 阅读更多
117 次浏览
分页媒体与连续媒体的不同之处在于,文档的内容被分成一个或多个离散的页面。分页媒体包括纸张、幻灯片、在计算机屏幕上显示的页面等。CSS2 定义了一个“页面框”,一个内容在其上呈现的有限尺寸的框。页面框是一个矩形区域,包含两个区域:页面区域:页面区域包括在该页面上布局的框。页面区域的边缘充当分页之间布局的初始包含块。页边距区域:它围绕 ... 阅读更多
111 次浏览
size 属性指定页面框的大小和方向。有四个值可用于页面大小auto - 页面框将设置为目标纸张的大小和方向。landscape − 覆盖目标的方向。页面框与目标大小相同,较长的一侧为水平方向。portrait − 覆盖目标的方向。页面框与目标大小相同,较短的一侧为水平方向。length − 'size' 属性的长度值会创建一个绝对页面框。如果只指定一个长度值, ... 阅读更多
144 次浏览
要使用 CSS 在图像上实现向左放大淡入动画效果,您可以尝试运行以下代码:示例实时演示 .animated { background-image: url(/css/images/logo.png); background-repeat: no-repeat; background-position: left top; padding-top:95px; margin-bottom:60px; -webkit-animation-duration: 10s; animation-duration: 10s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @-webkit-keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @keyframes fadeInLeftBig { 0% { opacity: 0; transform: translateY(-2000px); } 100% { opacity: 1; transform: translateY(0); } } .fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; } 重新加载页面 function myFunction() { location.reload(); }
257 次浏览
要使用 CSS 对图像实现淡入向下放大动画效果,您可以尝试运行以下代码 -示例实时演示 .animated { background-image: url(/css/images/logo.png); background-repeat: no-repeat; background-position: left top; padding-top:95px; margin-bottom:60px; -webkit-animation-duration: 10s; animation-duration: 10s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @-webkit-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @keyframes fadeInDown { 0% { opacity: 0; transform: translateY(-20px); } 100% { opacity: 1; transform: translateY(0); } } .fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown; } 重新加载页面 function myFunction() { location.reload(); }
210 次浏览
要使用 CSS 对图像实现淡入左侧动画效果,您可以尝试运行以下代码 -示例实时演示 .animated { background-image: url(/css/images/logo.png); background-repeat: no-repeat; background-position: left top; padding-top:95px; margin-bottom:60px; -webkit-animation-duration: 10s; animation-duration: 10s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } @-webkit-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translateX(-20px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @keyframes fadeInLeft { 0% { opacity: 0; transform: translateX(-20px); } 100% { opacity: 1; transform: translateX(0); } } .fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; } animation-name: fadeInDown; 重新加载页面 function myFunction() { location.reload(); }