首页 > WEB前端 > HTML/CSS >
概述:通过本次课程的学习和交流，帮你从一个网页制作的新手，转变为CSS达人.
-
代码技巧之常用快捷键的整理
HTML/CSS
常用快捷键的整理 ctr1+C复制 ctr1+V粘贴 ctrl+Z撤销 回到上一步操作 ctr1+D复制整行 ctr1+Z剪切整行 增加/删除单行注释ctrl+/ 增加/删除多行注释ctrl+shift+/ html注释 lt;!----gt; css注释/**/ JavaScrip...
2020-12-01 15:45:34 灰牛站长
阅读更多 -
z-index的特点
HTML/CSS
思路: ①z-index的结构/定位元素默认的z-index ②z-index单位 ③能不能用子元素和父元素比较 ④父元素没有z-index，能不能通过子元素控制他们的层级=改变层级，父元素z-index z-index属性的特...
2020-12-01 15:45:27 灰牛站长
阅读更多 -
定位元素的异同点
HTML/CSS
定位的值 position: absolute绝定位 position: relative相定位 position: fixed固定定位 定位的相同点和不同点 ===相同点: 可以 设置top/ bottom/ left/right四个方位值,如果同时有top、 bottom,只有top起作用...
2020-12-01 15:45:14 灰牛站长
阅读更多 -
定位之固定定位
HTML/CSS
固定定位- position: fixed 脱离文档流; 参照物是浏览器的可视窗口;任何元素都可以设置固定定位; 可设置top/ bot tom/left/ right四个方位 可通过z-index改变层级 !DOCTYPE htmlhtmlheadmeta charset="utf-8...
2020-12-01 15:45:07 灰牛站长
阅读更多 -
定位之相对定位
HTML/CSS
!DOCTYPE htmlhtmlheadmeta charset="utf-8"title/titlestyle type="text/css"/*相对定位特点1.不会离文档流 占位 所有后面的元素不会往前跑2.可以设置上下左右四个方位如果同的设置了top和bottom值只有top起...
2020-12-01 15:44:56 灰牛站长
阅读更多 -
定位之绝对定位
HTML/CSS
定位元素元素层级元素定位滚动条 绝对定位- position: absolute;特点 脱离文档流 可以设置参照物,参照物必须是其父级元素(直系父级),如果直接父级没有会一直往上查找直到找到最外层的根...
2020-12-01 15:44:49 灰牛站长
阅读更多 -
clear的值和特点及伪元素before和after的使用
HTML/CSS
clear:both的特点 元素需是块级元素 元素不能带有浮动属性 元素必须放在最后一个浮动元素的后面 用户是看不到这个元素的 clearfix清浮动方法的属性 浮动元素的父级选择器{*zoom:1;}/*只有...
2020-12-01 15:44:40 灰牛站长
阅读更多 -
如何让元素消失在我们的视野中(面试题)
HTML/CSS
!DOCTYPE htmlhtmlheadmeta charset="utf-8"title/titlestyle type="text/css"/*面试题:让元素消失在我们的视野中(发挥你的想象力)1.透明度 opacity:0;[0~1]2.display:none 隐藏3.width:0/height:0和overflow:hidden4.line-heigh...
2020-12-01 15:44:33 灰牛站长
阅读更多 -
clearfix的清浮动的技巧
HTML/CSS
!DOCTYPE htmlhtmlheadmeta charset="utf-8"title/titlestyle type="text/css".left,.right{width: 200px;height: 200px;float: left;}.left{background-color: brown;}.right{background-color: cornflowerblue;}.header,.footer{border: 10px solid red;}.h...
2020-12-01 15:44:25 灰牛站长
阅读更多 -
清浮动的方法
HTML/CSS
面试题:如何清浮动 给浮动元素的父元素手动添加一个固定的高度(不推荐） 给浮动元素的父元素设置overflow:hidden/auto .在浮动元素的父元素结束标签之前加一个具有块元素特点的标签(我...
2020-12-01 15:44:16 灰牛站长
阅读更多 -
浮动产生的影响
HTML/CSS
给父元素设置背景颜色属性不起作用 给父元素设置边框 border属性没有被撑开 给父元素设置内边距 padding属性也没有被撑开 !DOCTYPE htmlhtmlheadmeta charset="utf-8"title/titlestyle type="text/css".box{...
2020-12-01 15:44:09 灰牛站长
阅读更多 -
浮动元素的值
HTML/CSS
left元素向左浮动; right元素向右浮动; none默认值。元素不浮动,并会显示在其在文本中出现的位置; iherit规定应该从父元素继承float属性的值 !DOCTYPE htmlhtmlheadmeta charset="utf-8"title/titlestyle...
2020-12-01 15:44:01 灰牛站长
阅读更多 -
文档流和脱离文档流
HTML/CSS
文档流:指的是元素排版布局过程中,元素会自动从左往右,从上往下的流式排列。并最终窗体自上而下分成一行行,并在每行中从左至右的顺序排放元素 每个非浮动块级元素都独占一行,浮...
2020-12-01 15:43:49 灰牛站长
阅读更多 -
浮动元素的特点
HTML/CSS
float元素的特点 float元素的代码 float元素的特点 浮动元素在一行显示 设置属性值为left时,浮动元素会依次从父级盒子的左侧向右排布,设置属性值为right时,浮动元素会依次从父级盒子的右...
2020-12-01 15:28:25 灰牛站长
阅读更多 -
多行文本出现省略号必备的条件(面试题)
HTML/CSS
!DOCTYPE htmlhtmlheadmeta charset=utf-8title/titlestyle type=text/css.box{width: 600px;/*多行文本出现省略号必备的条件:主要用在移动端手机页面*/display: -webkit-box;/*弹性盒模型*/-webkit-box-orient: vertical;/*规定...
2020-11-18 22:43:59 灰牛站长
阅读更多 -
单行文本出现省略号必备的条件(面试题)
HTML/CSS
单行文本出现省略号必备的4个条件缺一不可: width宽度(不写宽度默认继承父元泰的宽度) overflow:hidden溢出隐臧 white-space:nowrap;强制不折行 text-overtlo:ellipsis;文字隐藏的方式:以省略号的方式...
2020-11-18 22:43:41 灰牛站长
阅读更多 -
让多个元素在一行显示的方法和技巧(面试题)
HTML/CSS
如图所示: display: inline div class=text1文字一/divdiv class=text2文字二/div .text1,.text2{display: inline;} display: inline-block div class=content1/divdiv class=content2/div .content1,.content2{width: 200px;height: 200px;display...
2020-11-18 22:43:23 灰牛站长
阅读更多 -
overflow的多个作用
HTML/CSS
①overflow溢出隐藏 p class=box栏目概述:①平面设计是什么?平面设计需要学什么?平面设计软件有哪些?ps,AI,cdr为设计师常用做图软件,栏目分享设计师构图经验与素材网站网址.②web前端如何...
2020-11-18 22:43:04 灰牛站长
阅读更多 -
雪碧图的使用和制作技巧
HTML/CSS
background-position背景定位 background-position属性设置背景图像的起始位置; xpos ypos第一个值是水平位置,第二个值是垂直。左上角是0。单位可以是长度值px,关键字和百分数值; 关键字成对出现...
2020-11-18 22:42:45 灰牛站长
阅读更多 -
列举background属性的8个属性值(面试题)
HTML/CSS
CSS中background的属性值 background-color background-image background-repeat background-position background-attachment 复合属性:background:background-color background-image background -repeat background-position background-attachmen...
2020-11-18 22:42:25 灰牛站长
阅读更多
