【Web前端HTML5&CSS3】11-定位

【【Web前端HTML5&CSS3】11-定位】的更多相关文章

【Web前端HTML5&CSS3】03-字符实体与语义标签

笔记来源:尚硅谷Web前端HTML5&CSS3初学者零基础入门全套完整版目录字符实体与语义标签 1. 字符实体 2. meta标签 3. 语义标签 4. 块元素与行内元素块元素(block element) 行内元素(inline element) 5. 内容修正 6. 布局标签 7. 列表 8. 超链接外部地址内部地址新建页面锚点跳转 9. 图片图片格式 jpeg(jpg) gif png webp base64 10. 内联格式 11. 音视频音频 source embed…

【Web前端HTML5&CSS3】05-样式继承与其他概念

笔记来源:尚硅谷Web前端HTML5&CSS3初学者零基础入门全套完整版目录样式继承与其他概念 1. 继承 2. 选择器的权重 3. 长度单位像素屏幕分辨率图像分辨率百分比 em rem 4. 颜色单位 RGB值 RGBA 十六进制的RGB值样式继承与其他概念 1. 继承样式的继承,我们为一个元素设置的样式,同时也会应用到它的后代元素上继承是发生在祖先后后代之间的,继承的设计是为了方便我们的开发利用继承,我们可以将一些通用的样式,统一设置到共同的祖先元素上.这样只需设置一次即…

【Web前端HTML5&CSS3】11-定位

笔记来源:尚硅谷Web前端HTML5&CSS3初学者零基础入门全套完整版目录定位的简介 1. 相对定位偏移量(offset) 相对定位的特点 2. 绝对定位绝对定位的特点包含块(containing block) 水平方向的布局水平居中垂直方向的布局垂直居中水平垂直居中小结 3. 固定定位固定定位的特点 4. 粘滞定位粘滞定位的特点 5. 几种定位的对比 6. 补充:元素层级存疑问题 7. 总结 8. 练习:京东轮播图定位的简介需求分析按照我们之前所学知识,可以怎…

【Web前端HTML5&CSS3】06-盒模型

笔记来源:尚硅谷Web前端HTML5&CSS3初学者零基础入门全套完整版目录盒模型 1. 文档流(normalflow) 2. 块元素 3. 行内元素 4. 盒子模型盒模型.盒子模型.框模型(box model) 内容区(content) 边框(border) 内边距(padding) 外边距(margin) 5. 水平方向布局 6. 垂直方向布局元素溢出边距折叠兄弟元素父子元素脱离文档流 7. 行内元素的盒模型 8. 浏览器的默认样式 reset样式 normalize样式盒…

【Web前端HTML5&CSS3】08-盒模型补充

笔记来源:尚硅谷Web前端HTML5&CSS3初学者零基础入门全套完整版目录盒模型补充及田径场实战 1. 盒子大小 2. 轮廓 3. 阴影 4. 圆角圆椭圆盒模型补充及田径场实战 1. 盒子大小默认情况下,盒子可见框的大小由内容区.内边距和边框共同决定 box-sizing用来设置盒子尺寸的计算方式(设置width和height的作用) .box { width: 200px; height: 200px; background-color: yellow; border: 10px…

【Web前端HTML5&CSS3】12-字体

笔记来源:尚硅谷Web前端HTML5&CSS3初学者零基础入门全套完整版目录字体 1. 字体相关的样式 2. font-family 3. 几种字体手写体艺术体乱码字体中文字体 4. @font-face 5. 图标字体(iconfont) 图标字体简介 fontawesome 图标字体其他使用方式通过伪元素设置通过实体设置 iconfont 字体 1. 字体相关的样式我们前面讲过字体的两个属性 color用来设置字体颜色 font-size字体的大小 em 相当于当前元素的一…

web前端开发:css3实现loading

web前端开发:css3实现loading 有大量web前端开发工具及学习资料,可以搜群[ web前端学习部落22群 ]进行下载,遇到学习问题也可以问群内专家以及课程老师哟 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>loading</title> <style> .container{width: 300px;height:…

1+x 证书 Web 前端开发 CSS3 专项练习

官方QQ群 1+x 证书 Web 前端开发 CSS3 专项练习 http://blog.zh66.club/index.php/archives/196/…

1+x证书Web前端开发CSS3详细教程

web 前端开发之 CSS3 新特性 http://blog.zh66.club/index.php/archives/189/ web 前端开发之 html5 新特性 http://blog.zh66.club/index.php/archives/190/ 妙笔生花博客-CSS 初识样式规则 http://blog.zh66.club/index.php/archives/213/ 妙笔生花博客-CSS 字体样式属性 http://blog.zh66.club/index.php/archi…

web前端基础之SCC(定位-z-index模态框）

目录一:定位(position) 1.relative(相对定位) 2.absolute(绝对定位) 3.fixed(固定) 二:相对定位 1.相对定位 2.实现相对定位三:绝对定位 1.实现绝对定位四:固定定位 1.实现固定定位五:验证浮动和定位是否脱离文档流(验证原来的位置是否保留) 1.什么是脱离文档流? 2.验证对象(能够改变标签位置的方法) 3.(不脱离文档流) 4.脱离文档流 5.测试相对定位 6.测试绝对定位 7.测试固定定位六:z-index之模态框案例 1.什么是模态…