今天感觉很累,早上起来脑袋昏沉昏沉的,很懵很懵,下午也是。自习的一天,复习了昨天的知识点,今天又看了新的内容。
1.通过css进行三角形的制作。本质上来说就是对高度和宽度为0的盒子设置边框,再对部分边框颜色透明显示,就可以生成三角形。
放一个示例图。
还有三角强化,本质上都是一样的,通过设置边框进行显示。以下代码。
.box { width: 0px; height: 0px; /* 不设置底部边框, 和左部边框,将上边框线改大,并设置为透明色 即可实现三角形*/
/* border-top: 160px solid transparent;
border-right: 80px solid blue; */
/* border-bottom: 80px solid green; */
/* border-left: 0px solid pink; */
/*以上是盒子三角形的基础形状 */
/* 以下为简洁复合代码 */
border-width: 160px 80px 0px 0px;
border-color: transparent blue transparent transparent;
border-style: solid; }
以下效果图:
2.用户界面中的鼠标样式的制作。
对标签添加cursor样式就可以生成。
3.取消表单输入框的轮廓线 outline:none;让行内块元素或者行内元素居中对齐 vertical-align:middle;(也可以用于取消图片下方小间距)
4.单行文本溢出显示省略号。
/* 强制文字在一行内进行显示 */
white-space: nowrap;
/* 对超出部分进行隐藏 */
overflow: hidden;
/* 对隐藏的部分用省略号代替 */
text-overflow: ellipsis;
5.margin负值的运用 效果:相邻两个盒子同时设置边框之后不能扩大宽度,对其中一个盒子设置外边距进行边框覆盖。
6.浮动原来的本质就是,浮动之后文字会产生环绕效果。
7.对行内块或行内元素的父元素添加text-align:center时会居中。