Css
文章平均质量分 54
William.Y
以匠人之心,做最好的产品。
展开
-
CSS-有关于图片的问题
一般在实际项目中,图片大多数情况下都是由标签插入进去的,这样的好处就是方便后期的维护以及在进行前后端对接时提供方便。可这就带来了一个问题,那就是由标签插进去的图片并不会像设置背景图片那样方便。在这里我给大家提供一个解决方案。1、首先给需要插入图片的div设置一个类名,可以是img-box、imgs等等,在这里我推荐使用img-box。2、img-box的宽高样式自定义。3、在style原创 2017-11-01 09:21:14 · 261 阅读 · 0 评论 -
前端零碎知识点,前端踩坑记录
This指向问题。this对象指向调用函数的对象,全局环境中this指向window。call和apply函数中的this指向指定的对象,如果所指定的是undefined或是null,this将重新指向window。在箭头函数中,this等同于外层代码块的this。取整时,建议使用Math.trunc( )来代替ParseInt( ),Math.trunc( )这个办法仅仅只是删除小数点后的数字原创 2019-08-02 16:00:47 · 384 阅读 · 0 评论 -
以匠人之心,做最完美的产品
匠人精神在我看来就是:一生只做一件事,并将这件事做到极致,在我看来,用心去做好一件事比做了很多很多的的事情更重要。这也是我对自己的要求与鼓励。可能会有人问,“如果坚持了一辈子,却没有名利双收,这样的坚持还算成功吗?”“如果坚持了一辈子,最后依然默默无闻,这样的人算得上精英吗?”在我看来这些将一生的心血都花费在自己热爱的事情上并为之而努力的人才是真正的精英,真正hero!有这样一个人,他的成绩全班倒数原创 2017-12-01 12:04:38 · 2029 阅读 · 1 评论 -
前端初始化代码
网易初始化代码: html {overflow-y:scroll;} body {margin:0; padding:0; font:12px,”微软雅黑”;background:#ffffff;} div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,blockquote,p{padding:0...转载 2017-11-20 10:35:16 · 1363 阅读 · 0 评论 -
Css3实现3D空间感
<div class="box"> <div></div> <div></div> <div></div> <div></div> <div></div></div>body{ perspective: 1000px;}.box{ width: 900px; height: 900px; margin: 30px auto;原创 2017-11-23 09:21:33 · 1120 阅读 · 0 评论 -
em、rem、px在Web开发中的区别
随着响应式设计的不断火热,基于相对字体大小的单位变开始流行起来,但他们真正的区别在哪里,有的时候会搞得晕头转向,在这里我来做个总结。如果有说的不当的地方,还请各位同仁多多指教。在说之前有两个很重要的概念,那就是font-size具有继承性以及body,html是根元素。px 这个单位的特点就是精准性。但是他的缺点就在于太过于精确从而导致用户在拖动、改变浏览器的字号大小以及尺寸时,就会出错。这样对于原创 2017-12-01 10:53:59 · 870 阅读 · 0 评论 -
CSS3 transform介绍
<ul class="nav-list"> <li class="nav-color nav-1">translate</li> <li class="nav-color nav-2">rotate</li> <li class="nav-color nav-3">scale</li> <li class="nav-color nav-4">skew</li>原创 2017-11-14 11:01:05 · 454 阅读 · 0 评论 -
使用 : after与:befor伪类画贯穿线
<div class="box"> 用以上社交帐号直接登录</div><style> .box{ position: relative; } .box::before{ content: ""; border-top: 1px solid #ededed; display: block;原创 2017-11-13 14:03:12 · 1703 阅读 · 1 评论 -
Css有关于圣杯及双飞翼布局
css中的负边距(negative margin)是布局中的一个常用技巧,只要运用得合理常常会有意想不到的效果。 说道margin负值问题就不得不说一下前端页面常见的布局:圣杯和双飞翼布局。其实这两种布局在实际应用上是一样的东西,不同的是概念不一样。使用的就是我们常见的float以及margin负值得概念圣杯布局来源于2006年发在a list part上的这篇文章:a list part 而双飞原创 2017-11-10 11:15:01 · 291 阅读 · 0 评论 -
有关Css自定义变量的介绍
首先,我先来说说什么是“自定义变量”顾名思义,就是可以随意定义变量名的一种变量。通常在前面都会加上 - -作为记号,它的作用和font-size、color等正式属性没什么区别。那为什么要在前面加上 “- - ”呢?因为$foo被 Sass 用掉了,@foo被 Less 用掉了。为了不产生冲突,官方的 CSS 变量就改用两根连词线了。 图中pulse选择器中定义了两个名为color和hover的属原创 2017-11-14 10:21:38 · 1226 阅读 · 0 评论 -
CSS实现文字竖向排版以及双实线的实现
双实线<style>border:5px double #d5d5d5;</style>文字竖排显示主要依靠 writing-mode实现<style> writing-mode: vertical-rl;</style>“writing-mode”共有三种属性horizontal-tb(默认值):自上而下,从左到右的横排书写方式。vertical-lr:从左到右,自上而下的竖排书写原创 2017-11-12 21:53:01 · 1704 阅读 · 0 评论 -
给子元素设置了margin后,父元素的跟着一起动了
一般就是给父元素设置overflow: hidden;即可解决问题,之所以出现这种情况的原因是:普通文档流盒子间,只要垂直外边距直接接触就会发生合并,合并后外边距视觉高度取两个发生合并外边距中较大者。发生这一现象的有三种情况:相邻兄弟块元素间、父元素及其首子元素和末子元素间(没有内边距或边框把外边距分隔开)、空块级元素自身的合并。原创 2017-11-01 10:12:22 · 3222 阅读 · 2 评论 -
Css3基于 box-shadow的鼠标悬停
<div class="buttons"> <h1>简单的悬停效果基于 <code>box-shadow</code></h1> <button class="fill">Fill In</button> <button class="pulse">Pulse</button> <button class="close">Close</button> <button class=原创 2017-11-09 10:10:27 · 923 阅读 · 0 评论 -
Css3-3D导航栏
<ul class="all clear"> <li class="box1"> <a href="#"> <span>home</span> <span>首页</span> </a> </li> <li class="box1">原创 2017-11-09 09:21:37 · 1354 阅读 · 0 评论 -
css设置小图标
通常我们在布局的时候都会遇到各种各样的小图标,类似于这样或者是这样 那么该如何放置这些小ico呢?有两种方法。第一种,创建一个小容器给小容器设置宽、高巴拉巴拉巴拉~然后将图片插进去或者设置成背景即可<i class="icon">要插入的图片</i><style> .icon{ width:10px; height:10px; font-st原创 2017-11-08 15:42:41 · 9843 阅读 · 0 评论 -
愿你出走半生,归来仍是少年(北京四中初二女学生作文)
愿 你文/北京四中初二学生见字如面-致未来的张咏言亲爱的自己:我不知道为什么写信给你,更不知道你何时能收到这封信,在这里有些愿望寄托于你。首先愿你平安无事地度过青春期,但别平安无事地度过青春。你不是他们口中的乖乖女,这点我比谁都清楚,你有时候果断、激动甚至有点“草莽精神”的意思,着实让我吓了一跳。愿你的世界里天天都是好天气。即便忘带伞也要告诉自己:宝宝今天偏要淋雨!原来驱赶阴霾的太阳...转载 2019-08-15 11:00:38 · 1194 阅读 · 0 评论