时间:2021-05-08
html部分内容
复制代码代码如下:
<div class="header">
<div class="eye_left"></div>
<div class="eye_right">
<div class="eye_in"></div>
</div>
<div class="head_bottom"></div>
</div>
css部分
复制代码代码如下:
*{ padding:0; margin:0;}
.header{ width:300px; margin:100px auto; position:relative; }
.eye_left,.eye_right{
width:30px;
height:30px;
background:#FFF;
position:absolute;
border:70px solid #0C0;
border-radius:160px;
-moz-border-radius:160px;
-webkit-border-radius:160px;
-o-border-radius:160px;}
.eye_left{
left:10px;
top:0px;}
.eye_right{
right:0px;
top:0px;}
.head_bottom{
width:200px;
border:#0C0 solid 60px;
border-radius:160px;
-moz-border-radius:160px;
-webkit-border-radius:160px;
-o-border-radius:160px;
height:30px;
left:0px;
position:absolute;
top:120px;
z-index:-5;}
.eye_in{
background:#0C0;
height:30px;
width:30px;
position:absolute;
right:-30px;
top:-30px;
border:#FFF 30px solid;
border-radius:160px;
-moz-border-radius:160px;
-webkit-border-radius:160px;
-o-border-radius:160px;}
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
给大家分享一个用CSS3.0结合video视频实现的创意开幕,效果如下:以下是代码实现,欢迎大家复制粘贴和收藏。CSS3.0结合video视频实现的创意开幕*{
网站的多列。多列是CSS3.0比较常用的一个功能,通过创建网站的多列,减少了为每列定制相关的层或段落,同时也可以设置多列的高度和宽度。CSS3.0通过colum
CSS3.0新特性。CSS是指层叠样式表(CascadingStyleSheet)。在网页设计过程中使用CSS可以对页面布局、背景、字体大小、颜色等效果进行展示
模块尺寸调整。在CSS3.0中首先设置resize的horizontal、vertical,both等属性,并加上max-width或min-width防止破坏
网页背景。CSS3.0可以设置网页的背景来实现页面的美化,其中借助background-origin来决定背景在页面的初始位置,background-size指