摘要：
运用合适的标签和特定的属性去格式化文档， 简单讲就是根据内容的结构化（内容语义化）， 选择合适的标签（代码语义化）便于开发者阅读和写出更优雅的代码的同时让浏览器的爬虫和机器很好地解析， 有利于SEO，便于团队开发和维护。 阅读全文
posted @ 2020-12-30 19:47
人间-
阅读(99)
评论(0)
推荐(0)
摘要：
不同的浏览器对CSS的解析结果是不同的，因此会导致相同的CSS输出的页面效果不同，这就需要CSS Hack来解决浏览器局部的兼容性问题。 而这个针对不同的浏览器写不同的CSS 代码的过程，就叫CSS Hack。 CSS属性Hack、CSS选择符Hack以及IE条件注释Hack 阅读全文
posted @ 2020-12-30 19:44
人间-
阅读(164)
评论(0)
推荐(0)
摘要：
使用背景图 对于页面中与页面内容无关，起修饰作用的图片，使用背景图 background-image（如页面中小图标尤其多次重复出现的，纹理性的背景），与页面内容相关展示性的图片如（广告图、产品图）使用 img 标签。 图片品质 注意图片优化：在保证视觉效果的情况下，选择最小的图片格式与图片质量，以 阅读全文
posted @ 2020-12-30 19:43
人间-
阅读(201)
评论(0)
推荐(0)
摘要：
用于绘画的 canvas 元素 用于媒体的 video 和 audio 元素 新的特殊内容元素，比如 article、footer、header、nav、section 新的表单控件，比如 calendar、date、time、email、url、search 阅读全文
posted @ 2020-12-30 19:41
人间-
阅读(25)
评论(0)
推荐(0)
摘要：
HTML5新标签对IE低版本浏览器的影响及兼容情况处理方案： 方案一：使用javascript新增元素的方法解决document.createElement(“header”);document.createElement(“footer”);… 由于创建出来的元素是内联元素，所以需要转换成块级，宽 阅读全文
posted @ 2020-12-30 19:40
人间-
阅读(478)
评论(0)
推荐(0)
摘要：
选择器 背景和边框阴影 文本效果 2D/3D 转换 动画 多列布局 阅读全文
posted @ 2020-12-30 19:37
人间-
阅读(94)
评论(0)
推荐(0)
摘要：
属性选择器 属性选择器在CSS2中就被引入，即E[attr]、E[attr=”value”]、E[attr~=”value”]。 结构性伪类选择器 :first-child 选择器：用于选取属于其父元素的首个子元素的指定选择器 :last-child 选择器：匹配属于其父元素的最后一个子元素的每个元 阅读全文
posted @ 2020-12-30 19:36
人间-
阅读(376)
评论(0)
推荐(0)
摘要：
1.动画循环就用animation。在animation中有一个animation-iteration-count属性可以定义循环次数。 transition是执行一次以后就不会执行，但是可以通过transitionEnd事件添加循环，与animation相比animation更加简单明了。 2.自 阅读全文
posted @ 2020-12-30 19:34
人间-
阅读(566)
评论(0)
推荐(0)
摘要：
2D translate()移动元素 rotate()旋转元素 scale()缩放元素 skew()倾斜 3D translateZ() 3D位移函数 3D旋转的函数有：rotateX、rotateY、rotateZ、rotate3d 3D缩放：scaleZ()函数指定一个在z轴上的缩放 阅读全文
posted @ 2020-12-30 19:30
人间-
阅读(239)
评论(0)
推荐(0)
摘要：
rem是指相对于根元素的字体大小的单位,即根据html元素的font-size来计算大小。 比如说html的font-size大小为100px,一个div的width为1rem,则div的width大小为100px。 阅读全文
posted @ 2020-12-30 19:28
人间-
阅读(281)
评论(0)
推荐(0)
摘要：
固定布局 在<head>里把viewport加好，根pc端一样，设想整个网页的宽度为320px居中即可，超出部分留白。 优点：思路沿用PC端，上手简单。 缺点：大屏幕手机及手机横屏时，两边是留白较大，且大屏幕手机下看起来页面会特别小，操作的按钮也很小，用户体验较差 流式布局 流动布局重点就是使用百分 阅读全文
posted @ 2020-12-30 19:26
人间-
阅读(171)
评论(0)
推荐(0)
摘要：
页面的设计与开发应当根据用户行为以及设备环境(系统平台、屏幕尺寸、屏幕定向等)进行相应的响应和调整。 响应式布局可以根据屏幕的大小自动的调整页面的展现方式，以及布局。响应式布局是根据设备屏幕宽度不同适当调整标签显示布局，在每种设4备屏幕宽度的设备下呈现的界面是不同的。 响应式网站的优点： 减少工作量 阅读全文
posted @ 2020-12-30 19:24
人间-
阅读(667)
评论(0)
推荐(0)
摘要：
ie8中图片边框问题 Ie8 中图片放在a标签中显示边框。 解决方案: img{border:none;} ie8中背景复合属性写法问题 如下代码，在标准浏览器中均能正常显示背景图片，但是在ie8中图片显示异常。 .bg{ background:url(“./images/bg.jpg”)no-re 阅读全文
posted @ 2020-12-30 19:22
人间-
阅读(136)
评论(0)
推荐(0)
摘要：
格式优点缺点使用场景 jpg 色彩丰富，文件小 有损压缩，反复保存图片质量下降明显 色彩丰富的图片/渐变图像 gif 文件小，支持动画、透明，兼容性比较好 只支持256种颜色 色彩简单的logo/icon/动图 png 无损压缩，支持透明，简单图片尺寸小 不支持动画，色彩丰富的图片尺寸大 logo/ 阅读全文
posted @ 2020-12-30 19:19
人间-
阅读(862)
评论(0)
推荐(0)
摘要：
ul,li/ol,li/dl,dt,dd拥有父子级关系的标签；ul、ol下都只能跟li，dl下只能跟dt.dd。 p,h标签里面不能嵌套块元素； a标签不能嵌套a； 行内元素不能嵌套块元素； 阅读全文
posted @ 2020-12-30 19:17
人间-
阅读(102)
评论(0)
推荐(0)
摘要：
1.display:none;（将整个元素隐藏，并且不会占据任何的空间） 2.visibility:hidden;（元素的内容不可见，但是元素仍然保持原来的位置和大小） 3.设定它的位置,让其消失不见： position:absolute或fixed，用z-index遮盖。 4.overflow:h 阅读全文
posted @ 2020-12-30 19:16
人间-
阅读(366)
评论(0)
推荐(0)
摘要：
因为浏览器的兼容问题，不同浏览器对有些标签的默认值是不同的，如果没对CSS初始化往往会出现浏览器之间的页面显示差异。 body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldse 阅读全文
posted @ 2020-12-30 19:14
人间-
阅读(311)
评论(0)
推荐(0)
摘要：
（1）单行文本溢出显示省略号 P{ width:200px； /*限定盒子的宽度*/ overflow:hidden; /*给元素设置溢出隐藏属性*/ text-overflow:ellipsis; /*文本溢出显示省略号*/ white-space:nowrap; /*文本不换行*/} （2）多行 阅读全文
posted @ 2020-12-30 19:12
人间-
阅读(161)
评论(0)
推荐(0)
摘要：
Block Formatting Context (块级格式化上下文) 它是指一个独立的块级渲染区域，只有Block-level BOX参与， 该区域拥有一套渲染规则来约束块级盒子的布局，且与区域外部无关。 怎样生成BFC 根标签 float的值不为none overflow 的值不为 visibl 阅读全文
posted @ 2020-12-30 19:06
人间-
阅读(188)
评论(0)
推荐(0)
摘要：
英文叫法 css sprites，通常被解释为“CSS 图像拼合”或“CSS 贴图定位”；其实就 是把网页中一些背景图片整合到一张图片文件中，再利用 CSS “background-image”， “background- repeat”，“background-position”的组合进行背景定位 阅读全文
posted @ 2020-12-30 19:05
人间-
阅读(560)
评论(0)
推荐(0)
摘要：
圣杯布局和双飞翼布局都是为了实现左右两栏固定宽度，中间部分自适应的三栏布局，不过两者实现的原理有所不同。以下是圣杯布局实现思路。 将三者都 float:left , 再加上一个position:relative (因为相对定位后面会用到） middle部分 width:100%占满 此时middle 阅读全文
posted @ 2020-12-30 19:04
人间-
阅读(597)
评论(0)
推荐(0)
摘要：
a.内联样式表的权值为1000 b.ID选择器的权值为100 c.class类选择器的权值为10 d.HTML标签选择器的权值为1 e.通配符选择器 阅读全文
posted @ 2020-12-30 18:59
人间-
阅读(212)
评论(0)
推荐(0)
摘要：
（1）内嵌式 通过<style></style>来书写CSS代码。 只能应用于当前网页，不能被其它网页共享。 注意：<style>标记可以放在网页的任何地方，但一般放在<head>。 （2）外联式 通过<link>标记来引入外部的CSS文件(.css)。 可以被其它网页共享。 格式：<link hr 阅读全文
posted @ 2020-12-30 18:58
人间-
阅读(224)
评论(0)
推荐(0)
摘要：
b标签是一个实体标签，它所包围的字符被设为bold（粗体)，而strong标签是一个语义标签，作用是加强字符的语义 em标签告诉浏览器把其中的文本表示为强调的内容。对于所有浏览器来说，这意味着要把这段文字用斜体来显示。 阅读全文
posted @ 2020-12-30 18:51
人间-
阅读(183)
评论(0)
推荐(0)
摘要：
浏览器：IE，Chrome，FireFox，Safari，Opera。 内核：Trident，Gecko，Presto，Webkit。 使用Trident的是internet explorer，国产的绝大部分浏览器。Trident是就是ie内核 使用Gecko的是Mozilla Firefox，使用 阅读全文
posted @ 2020-12-30 18:48
人间-
阅读(219)
评论(0)
推荐(0)
浙公网安备 33010602011771号