如何使用 css 將影片添加到帶邊框的 html 元素上,但又沒有邊框影片?現在發生的事情是整個事物影片化。這是代碼:
.pageName{
width: 14.0vh;
padding: 1.5vh 1.5vh 1.5vh 3.5vh;
font-family: Monaco;
font-weight: bold;
font-size: 2.0vh;
color: #006400;
margin: auto;
animation: blinker 5s linear infinite;
border-width: 0.5vh;
border-style: double;
border-radius: 1.0vh;
}
@keyframes blinker {
50% {
opacity: .25;
}
}
<div class="pageName">Title Page</div>
謝謝!
uj5u.com熱心網友回復:
您可以將文本分開并將其移動到 aspan并將影片應用于span. 請參閱下面的片段。
<html>
<head>
<meta name="viewport"
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, shrink-to-fit=no" />
<style>
body {
padding: 0;
margin: 0;
font-family: sans-serif;
}
.pageName {
width: 14.0vh;
padding: 1.5vh 1.5vh 1.5vh 3.5vh;
border-width: 0.5vh;
border-style: double;
border-radius: 1.0vh;
color: #006400;
margin: auto;
}
.pageName span {
animation: blinker 5s linear infinite;
font-family: Monaco;
font-weight: bold;
font-size: 2.0vh;
color: #006400;
}
@keyframes blinker {
50% {
opacity: .1;
}
}
</style>
</head>
<body>
<div class="pageName"><span>Title Page</span></div>
</body>
</html>
由于某些原因,在代碼片段編輯器中,布局變得混亂,但是如果您復制標記并在本地運行它,它應該看起來像您設計的那樣。
uj5u.com熱心網友回復:
嘗試用容器包裝您擁有的 div,并僅針對內部 div 使用影片
.container {
width: 14.0vh;
padding: 1.5vh 1.5vh 1.5vh 3.5vh;
font-family: Monaco;
font-weight: bold;
font-size: 2.0vh;
color: #006400;
margin: auto;
border-width: 0.5vh;
border-style: double;
border-radius: 1.0vh;
}
.pageName{
animation: blinker 5s linear infinite;
}
@keyframes blinker {
50% {
opacity: .25;
}
}
<div class="container">
<div class="pageName">Title Page</div>
</div>
轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/365467.html
