Как удалить контур в моем видеоплеереCSS

Разбираемся в CSS
Ответить Пред. темаСлед. тема
Anonymous
 Как удалить контур в моем видеоплеере

Сообщение Anonymous »

У меня есть простой видеоплеер, и при нажатии на кнопку воспроизведения видео появляется своего рода синий контур, который я хочу удалить.

Я пробовал базовый вариант: none, но ничего не изменилось. Я также исследовал Интернет, в том числе школы w3, и он посоветовал использовать атрибут контура. Я помещаю это не в то место?

HTML

Код: Выделить всё






[url=..videoplayer/intro.mkv]Download MP4[/url]

[list]
[*]Play/Pause
[*]Stop
[*]




[*]Mute/Unmute
[*]Vol+
[*]Vol-
[*]Fullscreen
[/list]




css

Код: Выделить всё

.video-container{
background-color: #191919;
width: 100%;
height: 1000px;
}
figure {
max-width:1024px;
max-width:64rem;
width:250%;
height:auto;
margin:20px 0 0;
margin:1.25rem 0 0;
}
figcaption {
display:block;
font-size:16px;
font-size:1rem;
}
video {
width:1150px;
margin-top:200px;
margin-left: 390px;
}
video#video {
outline: none
}
/* controls */
.controls, .controls li {
padding:0;
margin:0;
}
.controls {
display:none;
list-style-type:none;
overflow:hidden;
background:transparent;
}
.controls li {
float:left;
width:10%;
margin-left:0.3%;
}
.controls li:first-child {
margin-left:0;
}
.controls .progress {
width:38%;
cursor:pointer;
}
.controls button {
width:100%;
text-align:center;
overflow:hidden;
white-space:nowrap;
text-overflow:ellipsis;
}
.controls progress {
display:block;
width:100%;
height:20px;
height:1.25rem;
margin-top:2px;
margin-top:0.125rem;
border:1px solid #aaa;
overflow:hidden;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
}
.controls progress span {
width:0%;
height:100%;
display:inline-block;
background-color:#2a84cd;
}

/* fullscreen */
html:-ms-fullscreen {
width:100%;
}
:-webkit-full-screen {
background-color:transparent;
}
/* hide controls on fullscreen with WebKit */
figure[data-fullscreen=true] video::-webkit-media-controls {
display:none !important;
}
figure[data-fullscreen=true] {
max-width:100%;
width:100%;
margin:0;
padding:0;
}
figure[data-fullscreen=true] video {
height:auto;
}
figure[data-fullscreen=true] figcaption {
display:none;
}
figure[data-fullscreen=true] .controls {
position:absolute;
bottom:2%;
width:100%;
z-index:2147483647;
}
figure[data-fullscreen=true] .controls li {
width:5%;
}
figure[data-fullscreen=true] .controls .progress {
width:68%;
}
Скриншот контура, который я хочу удалить
Изображение

Любая помощь приветствуется и заранее спасибо

Подробнее здесь: https://stackoverflow.com/questions/576 ... deo-player
Реклама
Ответить Пред. темаСлед. тема

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

  • Похожие темы
    Ответы
    Просмотры
    Последнее сообщение

Вернуться в «CSS»