html
文章平均质量分 54
ryipei
单身狗
展开
-
css中的显示与隐藏,通过定位position实现播放遮罩
<div class="box"> <div class="shad"> </div> </div>.box { /* 父元素相对定位 */ position: relative; margin: 100px auto; width: 448px; height: 252px; .原创 2021-04-07 15:03:58 · 194 阅读 · 0 评论 -
九、弹性布局flex 1、给父盒子加dispaly:flex
九、弹性布局flex1、给父盒子加dispaly:flex这三个属性将失效float 、 vertical-align 、 clear子元素高默认与父元素等高,flex布局下的子元素默认不会换行,子元素的宽度总和比父元素多的时候会自动压缩。2、flex-flowflex-flow:row wrap; 这是flex-direction 和flex-direction 的复合属性(1)flex-direction:设置主轴的方向(不设置的时候,默认是x轴)row从左到右,...原创 2021-04-01 21:16:27 · 240 阅读 · 0 评论 -
八、响应式布局,百分比布局,和弹性布局 felx
八、响应式布局1、百分比布局(1)子元素的宽高百分比设置:①手动计算百分比 width:30%②利用计算函数属性, width:calc(子元素宽 / 父宽 * 100% ) 运算符号前后空格,计算高同理(2)版心的百分比布局设置避免版心出现左右滚动条,设置版心的宽度100%,设置最大宽度。即如下:.w{ width:100%; max-width:800px; margin:0auto;}免费字体:阿里 iconfont2、媒体特性(媒体查...原创 2021-04-01 21:15:44 · 666 阅读 · 0 评论 -
七、H5 新标签 + CSS3。动画animation,transform,结构伪类选择器新标签,媒体
七、H5 新标签 + CSS31、额外:快捷键p.box生成p标签,类名box p#box 生成p标签,id名box ul>li*5>a ul里面五个li,每个li里一个aul>li>a*5 ul里面一个li,一个li里面5个ap.box+p+h 生成同级p p h2、新标签(1)布局结构新增的标签header 、 nav 、section 、footer 、video 、audio(2)表单新增的input type属性值emai...原创 2021-04-01 21:14:32 · 313 阅读 · 0 评论 -
六、css高级技巧,元素的显示与隐藏,多余的字,弹性布局,精灵图
六、css高级技巧1、元素的显示与隐藏(1)display设置或检索对象是否及如何显示①display:none; 隐藏对象②隐藏后不占位置③通过display:block;可以显示元素(2)visibility 设置或检索是否显示对象①visibility:visible;对象可见,这是默认值,不写也是②visibility:hidden;对象隐藏③隐藏后,位置继续保留(仍然占据之前的位置)(3)overflow溢出①overflow:visible;不剪切内容原创 2021-04-01 21:11:30 · 314 阅读 · 0 评论 -
前端中,HTML易忘点
一、HTML易忘点1、常见标签 h1~h6 、 p 、br 、 hr(水平线) 、文本格式化标签、div 、span 、img 、a 、ul>li 、ol>li 、dl>(dt头 、dd身)2、关于 a 标签的相关要点target属性①target:self当前窗口打开页面,默认。设置页内跳转,<a href=”#锚点名”>内容</a>给目的标签设置 id 属性 例如:<p id=”锚点名”>内容/<p>②targ原创 2021-04-01 21:01:19 · 72 阅读 · 0 评论