html/css
坚持原创
这个作者很懒,什么都没留下…
展开
-
杂录
关于有些HTML的属性可以不用写值如(required)而有些却要。主要是因为有枚举型和布尔型之分。枚举型就是一个变量只可能有这几种取值。如spellcheck,必须显式地设置值为true或者false如spellcheck="true"就不能只写spellcheck。:focus-within 这个伪类,它或者它的后代获得焦点都可以触发。比如说用在form表单上,foucs任意一个in...原创 2019-12-05 15:38:00 · 269 阅读 · 0 评论 -
css replaced element置换元素
先声明,对于这个概念,不需要深入探究,因为厂商并不一定按规范走,了解就好。对replaced element的理解应该是可以影响容器,比如说width和height啥的,不会影响里面的内容。但是事实上也并不是这样。插入一条:有些人喜欢问一个问题,行内元素没办法设置宽高,为什么<input>却可以设置width?然后他们接下来就要告诉你,因为输入框是置换元素。这种明显就是...原创 2019-12-04 15:13:47 · 264 阅读 · 0 评论 -
css中background个人理解
这是一个层叠关系,最底层是background-color, 然后上面依次是图片,在style中出现后面的置于其上。于是就有了同时设置color和image的做法,保证在image还没加载出来的时候,有color先垫着。border一定是在background-color和background-image上的,不会被它们遮住background-origin和background-clip的...原创 2019-12-04 14:19:51 · 277 阅读 · 0 评论 -
css3 animation学习心得
先说一下与transition的区别,因为他们真的有点点相似。animation动画可以通过@keyframes属性对动画进行更为精细的控制,设置多个状态。但是transition属性则只有两个状态,起始状态与结束状态。两个属性的触发时机有很大的不同,animation好比是一个自执行函数,只要定义好,立马生效触发动画。transition则像是一个事件处理函数(事件监听器),只有...原创 2019-12-03 19:08:04 · 796 阅读 · 0 评论 -
box-shadow
模糊半径blur往阴影两端拓展,所以是值的一半。第二步是实现渐变。就是从内而外逐渐模糊。扩展半径spread直接扩展阴影面积,然后在此基础上才有模糊半径。这里不用减半实例此时刚好紧贴...原创 2019-12-03 17:00:49 · 138 阅读 · 0 评论 -
css伪元素心得
::before和::after差不多,所以这里只用::before举例。时刻记住,::before的表现是父元素下的第一个内联元素,(默认的display是inline)并不是说就一定会在同一行什么的。<p>aaa</p>p::before { color: red; content: 'before';}可以理解为<p><sp...原创 2019-12-03 11:41:47 · 278 阅读 · 0 评论 -
display:none和visibility:hidden的区别
有个博客已经说得很好了,我看了之后做了一下总结。display:none的元素不会出现在render树,但是dom树上还是存在的,否则无法响应事件。display:none后无论怎么修改子元素的display,都没用,因为根本不在render树中。hidden的元素依旧会占位,只是看不到。子元素修改visilibilty: visible;是可以显现的,这个结果也正常,毕竟hidden的元素...原创 2019-05-20 12:04:54 · 1450 阅读 · 0 评论 -
写border遇到的问题
首先,一般都习惯写border,但是border:rgb(223,230,236) 1px 0px 0px 1px solid;这样写是不行的,查看文档后发现,border只接受三个参数,意思就是你不能对每条边分别设宽度。所以如果要这么写,就必须拆分成broder-width, border-color, border-style另外一个就是,border重叠的话,是会颜色加深的,...原创 2019-05-24 13:03:42 · 347 阅读 · 0 评论