|
Before Width: | Height: | Size: 257 KiB |
|
Before Width: | Height: | Size: 9.3 KiB |
|
Before Width: | Height: | Size: 9.3 KiB |
|
Before Width: | Height: | Size: 9.3 KiB |
|
Before Width: | Height: | Size: 248 KiB |
|
Before Width: | Height: | Size: 248 KiB |
|
Before Width: | Height: | Size: 248 KiB |
|
Before Width: | Height: | Size: 217 KiB |
|
Before Width: | Height: | Size: 217 KiB |
@ -1,17 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>菜鸟教程(runoob.com)</title>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<p>移动视频的播放位置</p>
|
||||
|
||||
<video id="myVideo" width="320" height="176" controls>
|
||||
<source src="/Users/hs/Downloads/SampleVideo_1280x720_2mb.mp4" type="video/mp4" preload="none">
|
||||
您的浏览器不支持 HTML5 video 标签。
|
||||
</video>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
Before Width: | Height: | Size: 6.1 KiB |
|
Before Width: | Height: | Size: 6.1 KiB |
@ -1,65 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>彩虹</title>
|
||||
<style>
|
||||
.rainbow-wrap {
|
||||
width: 500px;
|
||||
height: 500px;
|
||||
background-color: red;
|
||||
position: relative;
|
||||
left: 20px;
|
||||
top: 20px;
|
||||
border-radius: 100%;
|
||||
}
|
||||
.rainbow-wrap::after {
|
||||
content: '';
|
||||
width: 500px;
|
||||
height: 250px;
|
||||
background-color: white;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
}
|
||||
.rainbow-wrap::before {
|
||||
content: '';
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
background-color: white;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
border-radius: 100%;
|
||||
top: 150px;
|
||||
z-index: 10;
|
||||
left: 150px;
|
||||
}
|
||||
.rainbow-wrap .rainbow-item {
|
||||
position: absolute;
|
||||
width: 400px;
|
||||
height: 400px;
|
||||
border-radius: 100%;
|
||||
background-color: yellow;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
.rainbow-item:nth-child(2) {
|
||||
background-color: blue;
|
||||
width: 300px;
|
||||
height: 300px;
|
||||
}
|
||||
.rainbow-item:nth-child(3) {
|
||||
background-color: green;
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="rainbow-wrap">
|
||||
<div class="rainbow-item"></div>
|
||||
<div class="rainbow-item"></div>
|
||||
<div class="rainbow-item"></div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,65 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>彩虹</title>
|
||||
<style>
|
||||
.rainbow-wrap {
|
||||
width: 500px;
|
||||
height: 500px;
|
||||
background-color: red;
|
||||
position: relative;
|
||||
left: 20px;
|
||||
top: 20px;
|
||||
border-radius: 100%;
|
||||
}
|
||||
.rainbow-wrap::after {
|
||||
content: '';
|
||||
width: 500px;
|
||||
height: 250px;
|
||||
background-color: white;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
}
|
||||
.rainbow-wrap::before {
|
||||
content: '';
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
background-color: white;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
border-radius: 100%;
|
||||
top: 150px;
|
||||
z-index: 10;
|
||||
left: 150px;
|
||||
}
|
||||
.rainbow-wrap .rainbow-item {
|
||||
position: absolute;
|
||||
width: 400px;
|
||||
height: 400px;
|
||||
border-radius: 100%;
|
||||
background-color: yellow;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
.rainbow-item:nth-child(2) {
|
||||
background-color: blue;
|
||||
width: 300px;
|
||||
height: 300px;
|
||||
}
|
||||
.rainbow-item:nth-child(3) {
|
||||
background-color: green;
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="rainbow-wrap">
|
||||
<div class="rainbow-item"></div>
|
||||
<div class="rainbow-item"></div>
|
||||
<div class="rainbow-item"></div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||