09 2020 档案

13 定位
摘要：1.为什么需要定位 提问： 以下情况使用标准流或者浮动能实现吗？1. 某个元素可以自由的在一个盒子内移动位置，并且压住其他盒子. 2. 当我们滚动窗口的时候，盒子是固定屏幕某个位置的。 以上效果，标准流或浮动都无法快速实现，此时需要定位来实现。所以：1.浮动可以让多个块级盒子一行没有缝隙排列显示， 阅读全文
posted @ 2020-09-23 23:21 GHNSL 阅读(147) 评论(0) 推荐(0)
12.页面设计思路
摘要：1.准备工作 采取结构与样式相分离思想：1. 创建 目录文件夹 (用于存放我们这个页面的相关内容),例如study目录。2. study 目录内新建 images 文件夹，用于保存图片。3. 新建首页文件 index.html（以后我们的网站首页统一规定为 index.html )。4. 新建 st 阅读全文
posted @ 2020-09-18 07:28 GHNSL 阅读(767) 评论(0) 推荐(0)
11. PS切图
摘要：常见的图片格式 PS 有很多的切图方式：图层切图、切片切图、PS 插件切图等。 1 图层切图最简单的切图方式：右击图层 ->导出 PNG 切片。 下的ps不好使，以后再说吧 阅读全文
posted @ 2020-09-16 23:21 GHNSL 阅读(113) 评论(0) 推荐(0)
10. 清除浮动
摘要：1. 为什么要清除浮动 由于父级盒子很多情况下，不方便给高度，但是子盒子浮动又不占有位置，最后父级盒子高度为 0 时，就会影响下面的标准流盒子。  由于浮动元素不再占用原文档流的位置，所以它会对后面的元素排版产生影响 2 .清除浮动本质 清除浮动的本质是清除浮动元素造成的影响 如果父盒子本身有 阅读全文
posted @ 2020-09-14 22:49 GHNSL 阅读(152) 评论(0) 推荐(0)
7.圆角边框,盒子阴影,文字阴影
摘要：1. 圆角边框 在 CSS3 中，新增了圆角边框样式，这样我们的盒子就可以变圆角了。 border-radius 属性用于设置元素的外边框圆角。 语法： border-radius:length; 参数值可以为数值或百分比的形式 如果是正方形，想要设置为一个圆，把数值修改为高度或者宽度的一半即可 阅读全文
posted @ 2020-09-11 22:43 GHNSL 阅读(272) 评论(0) 推荐(0)
6.5 阶段总结
摘要：1. 布局为啥用不同盒子,我只想用div？ 标签都是有语义的, 合理的地方用合理的标签。比如产品标题 就用 h, 大量文字段落就用p 2. 为啥用辣么多类名？ 类名就是给每个盒子起了一个名字,可以更好的找到这个盒子, 选取盒子更容易,后期维护也方便。 3. 到底用 margin 还是 padding 阅读全文
posted @ 2020-09-11 22:40 GHNSL 阅读(86) 评论(0) 推荐(0)
6.PS基础操作
摘要：因为网页美工大部分效果图都是利用 PS（Photoshop）来做的，所以以后我们大部分切图工作都是在 PS 里面完成。  文件打开 ：可以打开我们要测量的图片  Ctrl+R：可以打开标尺，或者 视图 > 标尺  右击标尺，把里面的单位改为像素  Ctrl+ 加号(+)可以放大视图， Ct 阅读全文
posted @ 2020-09-11 22:39 GHNSL 阅读(132) 评论(0) 推荐(0)
4. CSS三大特性
摘要：层叠 继承 优先级 是我们学习CSS 必须掌握的三个特性。 CSS层叠性 所谓层叠性是指多种CSS样式的叠加。 是浏览器处理冲突的一个能力,如果一个属性通过两个相同选择器设置到同一个元素上，那么这个时候一个属性就会将另一个属性层叠掉 比如先给某个标签指定了内部文字颜色为红色，接着又指定了颜色为蓝色， 阅读全文
posted @ 2020-09-11 22:24 GHNSL 阅读(130) 评论(0) 推荐(0)
3.CSS背景
摘要：通过 CSS 背景属性，可以给页面元素添加背景样式。 背景属性可以设置背景颜色、背景图片、背景平铺、背景图片位置、背景图像固定等。 3.1背景颜色 background-color 属性定义了元素的背景颜色。 一般情况下元素背景颜色默认值是 transparent（透明），我们也可以手动指定背景颜色 阅读全文
posted @ 2020-09-11 22:15 GHNSL 阅读(155) 评论(0) 推荐(0)
2.CSS 的元素显示模式
摘要：1. 什么是元素显示模式 作用：网页的标签非常多，在不同地方会用到不同类型的标签，了解他们的特点可以更好的布局我们的网页。 元素显示模式就是元素（标签）以什么方式进行显示，比如<div>自己占一行，比如一行可以放多个<span>。 HTML 元素一般分为块元素和行内元素两种类型 2 块元素 常见的块 阅读全文
posted @ 2020-09-11 22:09 GHNSL 阅读(116) 评论(0) 推荐(0)
1 复合选择器
摘要：1.1 什么是复合选择器 在 CSS 中，可以根据选择器的类型把选择器分为基础选择器和复合选择器，复合选择器是建立在基础选择器之上，对基本选择器进行组合形成的。  复合选择器可以更准确、更高效的选择目标元素（标签）  复合选择器是由两个或多个基础选择器，通过不同的方式组合而成的  常用的复合选 阅读全文
posted @ 2020-09-11 22:02 GHNSL 阅读(192) 评论(0) 推荐(0)
0 css简介 基础选择器 文本 字体 引入方式
摘要：1.css简介 1.1css 网页的美容师 CSS 是层叠样式表 ( Cascading Style Sheets ) 的简称.有时我们也会称之为 CSS 样式表或级联样式表。CSS 是也是一种标记语言CSS 主要用于设置 HTML 页面中的文本内容（字体、大小、对齐方式等）、图片的外形（宽高、边框 阅读全文
posted @ 2020-09-11 21:01 GHNSL 阅读(236) 评论(0) 推荐(0)
9.常见网页布局
摘要：1.常见网页布局 2. 浮动布局注意点 1. 浮动和标准流的父盒子搭配。先用标准流的父元素排列上下位置, 之后内部子元素采取浮动排列左右位置 2. 一个元素浮动了，理论上其余的兄弟元素也要浮动。一个盒子里面有多个子盒子，如果其中一个盒子浮动了，那么其他兄弟也应该浮动，以防止引起问题。浮动的盒子只会影 阅读全文
posted @ 2020-09-11 20:34 GHNSL 阅读(202) 评论(0) 推荐(0)
8.浮动
摘要：1. 传统网页布局的三种方式 网页布局的本质——用 CSS 来摆放盒子。 把盒子摆放到相应位置.CSS 提供了三种传统布局方式(简单说,就是盒子如何进行排列顺序)：普通流（标准流）浮动定位 网页布局第一准则：多个块级元素纵向排列找标准流，多个块级元素横向排列找浮动 网页布局第二准侧: 先设置盒 阅读全文
posted @ 2020-09-11 07:26 GHNSL 阅读(163) 评论(0) 推荐(0)
5.盒子模型
摘要：页面布局要学习三大核心, 盒子模型, 浮动 和 定位. 学习好盒子模型能非常好的帮助我们布局页面. 1.盒子模型 1.1 看透网页布局的本质 网页布局过程： 1. 先准备好相关的网页元素，网页元素基本都是盒子 Box 。比如说div,p,span 2. 利用 CSS 设置好盒子样式，然后摆放到相应位 阅读全文
posted @ 2020-09-10 22:05 GHNSL 阅读(229) 评论(0) 推荐(0)