标签：文字 06 基础 边框 导入 改成 三角形 css 图标

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 精灵图就是只要导入一张照片（这张照片里面有很多很多的小图标和照片），然后通过background-position来移动位置，使网页显示出对应图片或者图标。一般都是负值。

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 下载然后导入项目里。

 

 

 

 

 

 

 

 

 

 

 不同浏览器支持字体不一样，但是下载的时候已经自动生成了四种对应的格式。

 

 

 字体声明：

 

 

 

 复制小框框。每个小框框都不一样（虽然看着一样），一定要去复制！！！！

 

 

 

 直接第一句代码就可以使用你想要的图标了。

 

 

 

 导入旧的，加了新的图标进去后，重新生成新的图标集，然后再导入项目里的根目录就好了。

和精灵图的原理差不多。

 

 

         

 

 一个盒子没有大小，只有边框（边框有数值）是这样的，就都是三角形，然后把其他的改为透明色就形成了对应方向的三角形了。

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

设置文本域的右下角不能拖动。原本是默认可以拖动放大的。

 

 

 

 文本域的代码最好在一行，不同行了显示出来的起始的文字也会有空格。

 

 

 

 

 

 图片和文字实现垂直居中。

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 块级元素是没有基线对齐这个属性的。

 

 

 

 

 

 

 

 

 

 

 

 

 

 有较大的兼容性问题，IE就显示不出来。但是没有也没关系，显示大致内容就好了。

 

 

 

 

 

 

  

 

 

 边框重叠成2px会加粗。原理就是-1px会往前压住，正好显示只有ipx

 

 去小圆点。

 

 

 

 当鼠标经过盒子时，边框会变成其他颜色，要用定位才能解除被压着的一边的边框。

 

 

 

 

 

 

 因为浮动的目的就是让文字围绕图片的。文字永远不会跑到盒子底下！右边文字不用加高度加宽度。

 

 

 

 text-align：center

 

 

 

 

 

 

 

 

 

 把下面的三角形去掉

变这样： 把上面的三角形增大：去掉左侧： 上面改成透明色：

 

 

 

 

 

 

 

 左侧也去掉的话

 

 

 最上面的不能改成0px，改成零了就不能成为一个三角形了，消失了，上面的要改成透明色。

 

 

 

 简写代码后：

 

 

 案例：

 

 

 

 

 

 

 

 

 

 

 

 

 

  

 

 

 

 

 

 

 

 a链接取消下划线和删除蓝色字体。鼠标经过变成红色。

 

 

 所有按钮和输入文字统一字体。

 

 对整个body的页面统一。

 

 

 

 

 

 

 

 清除浮动用的时伪元素。

 

 

 

 

 

 

 

 直接复制粘贴就好，不用背。

 

 

 

 

标签：文字,06,基础,边框,导入,改成,三角形,css,图标
来源： https://www.cnblogs.com/dongdongkuang/p/16503790.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。