随笔分类 -  02-css基础

CSS实现单行、多行文本溢出显示省略号（…）
摘要：如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来，当然还需要加宽度width属来兼容部分浏览。 实现方法： 效果如图： 但是这个属性只支持单行文本的溢出显示省略号，如果我们要实现多行文本溢出显示省略号呢。 接下来重点说一说多行文本溢出显示省略号，如 阅读全文
posted @ 2018-07-20 09:32 明明明明明明明明 阅读(1567) 评论(0) 推荐(0)
CSS3 04. 伸缩布局、设置主轴，侧轴方向、主／侧轴对齐方式、 伸缩比例、元素换行、换行控制、覆盖父元素的align-items；控制子元素顺序、web字体、突变字体
摘要：CSS3 在布局方面做了非常大的改进，对块级元素的布局排列变得十分灵活，适应性非常强，其强大的伸缩性，在响应式开发中可以发挥极大的作用。（兼容性不好） 必要元素： 指定一个盒子为伸缩盒子 display:flex; 设置属性来调整此盒子的子元素的布局方式：如 flex-direction； 明确主侧 阅读全文
posted @ 2017-05-16 14:42 明明明明明明明明 阅读(4958) 评论(0) 推荐(0)
CSS3 03. 3D变换、坐标系、透视perspective、transformZ、transform-style添加3D效果、backface-visibility元素背面可见、动画animation、@keyfarmes、多列布局
摘要：1、左手坐标系 伸出左手，让拇指和食指成“L”形，大拇指向右，食指向上，中指指向前方。这样我们就建立了一个左手坐标系，拇指、食指和中指分别代表X、Y、Z轴的正方向。如下图 CSS中的3D坐标系 CSS3中的3D坐标系与上述的3D坐标系是有一定区别的，相当于其绕着X轴旋转了180度，如下图 左手法则 阅读全文
posted @ 2017-05-06 11:30 明明明明明明明明 阅读(5253) 评论(2) 推荐(0)
CSS3 02. 边框、边框圆角、边框阴影、边框图片、渐变、线性渐变、径向渐变、背景、过渡transition、2D转换(缩放、位移、旋转、倾斜)
摘要：边框圆角　border-radius 每个角可以设置两个值，x值、y值 border-top-left-radius：水平半径 垂直半径 border-radius：水平半径/垂直半径 border-radius:60px 30px 120px 160px/160px 120px 30px 60px 阅读全文
posted @ 2017-05-02 16:53 明明明明明明明明 阅读(4979) 评论(0) 推荐(0)
CSS3 01. CSS3现状、属性选择器、伪类选择器、结构伪类、伪元素选择器、颜色、文本阴影shadow、盒子模型、私有化前缀
摘要：CSS 3 现状 兼容性差，需添加私有前缀／移动端优于PC端／不断改进中／渐进增强原则／考虑用户群体／遵照产品的方案 ； CSS3手册 需要阅读其--阅读及使用指引 []表示全部的可选项 || 或者 | 表示 多选一 ? 表示 0个或1个 * 表示 0个或多个 {}表示范围 {A}代表出现A次 ，{ 阅读全文
posted @ 2017-04-29 23:59 明明明明明明明明 阅读(474) 评论(0) 推荐(0)
CSS常见兼容性问题总结
摘要：原文链接：渔人码头 http://www.cnblogs.com/imwtr/p/4340010.html?utm_source=tuicool&utm_medium=referral 浏览器的兼容性问题，通常是因为不同的浏览器对同一段代码有不同的解析，造成页面显示不统一的情况。 这里谈到的浏览器， 阅读全文
posted @ 2017-03-11 08:03 明明明明明明明明 阅读(904) 评论(0) 推荐(1)
CSS -- 练习之制作简单商品图
摘要：只加深了印象，出错点：未给左侧人物大图宽高，致使第二行图层叠在其上； 阅读全文
posted @ 2017-03-04 22:45 明明明明明明明明 阅读(426) 评论(0) 推荐(0)
CSS -- 练习（待续优化）
摘要：啊啊啊 错误百出啊 错点总结： 字符全角半角、清楚浮动、结尾</div>有点乱找不到对应的了、注释要写好、 恢复内容结束 阅读全文
posted @ 2017-03-04 00:57 明明明明明明明明 阅读(305) 评论(0) 推荐(0)
CSS.06 -- 尚合网页模拟
摘要：Document .logo>img[src="images/logo.jpg"]+^.search>input[type="text"]+input[type="button"] --> ... 阅读全文
posted @ 2017-03-01 22:52 明明明明明明明明 阅读(1620) 评论(0) 推荐(0)
CSS.05 -- 规避脱标 定位的盒子居中、CSS标签规范、溢出隐藏、内容移除（网页优化）、CSS精灵图
摘要：规避脱标 定位的盒子居中显示 Margin：0 auto ； 只能让标准流的盒子居中对齐 当A是B的父系，B可以使用 margin-left：auto； 来获得相当于定位right：0；的效果 Margin-right：auto； 定位的盒子剧中 先左右走父元素盒子的一半50%，在向左走盒子的一半（ 阅读全文
posted @ 2017-02-28 22:42 明明明明明明明明 阅读(1074) 评论(0) 推荐(0)
CSS.04 -- 浮动float、overflow、定位position、CSS初始化
摘要：浮动float、清除浮动、overflow（溢出元素框时）、定位position（stratic静态、absolute绝对、relative相对、fixed固定）、CSS初始化 阅读全文
posted @ 2017-02-27 23:34 明明明明明明明明 阅读(764) 评论(0) 推荐(0)
CSS.03 -- 浏览器行高、字体；盒子模型--边框、内边距、外边距
摘要：CSS行高line-height、盒子模型（内边距padding、边框border、外边距margin）、内边距撑大盒子、盒子的宽度、 阅读全文
posted @ 2017-02-25 21:12 明明明明明明明明 阅读(2232) 评论(1) 推荐(1)
CSS.02 -- 样式表 及标签分类（块、行、行内块元素）、CSS三大特性、背景属性
摘要：样式表书写位置；CSS标签分类（行、块、行内块）；CSS三大特性（层叠性、继承性、优先级）；CSS链接伪类；text-decoration、background属性、 阅读全文
posted @ 2017-02-25 21:10 明明明明明明明明 阅读(1141) 评论(0) 推荐(0)
CSS.01 -- 选择器及相关的属性文本、文字、字体、颜色、
摘要：CSS基本概念、字体属性；选择器分类；页面布局常见命名规范； 阅读全文
posted @ 2017-02-25 21:01 明明明明明明明明 阅读(8862) 评论(0) 推荐(0)