Sym - 一个用 Java 实现的现代化社区平台 • 源码注册

Pipe - 小而美的开源博客平台 • 体验皮肤
Solo - 一个用 Java 实现的博客系统,为你或你的团队创建个博客吧! • 源码下载
Wide - 一个基于 Web 的 Go 语言 IDE • 教程试用

0 篇文章

CSS 优先级是如何计算的?

2019-01-03 回答浏览器通过优先级权重来判断 CSS 属性值与元素之间的关系:权重越高关系越密切,高权重的 CSS 属性值就会赋予到元素上。我们可以把 CSS 分为四类,每类的矩阵权重从高到底排列如下:内联样式(如:style="font-weight:bold"):[1,0,0,0]ID 选择器(如:#comments):[0,1,0,0] 类选择器(如:.footer),属性选择器(如:[src$=".p

`+` 和 `~` 选择器有什么区别?

2019-01-02 回答毗邻兄弟选择器 + 可以选择紧随元素后的所有同级元素。如:div~p 可以选择紧随 div 元素后且与其同级的 p 元素。一般兄弟选择器~ 可选择元素后的所有同级元素。如:p~span 将会匹配同一父元素下,p 元素后的所有 span 元素。加分回答基本元素选择器 *:通用元素选择器,匹配任何元素. footer:匹配 class="footer" 的所有元素 #comments:匹配 id="comments

CSS sprites 的优点及如何使用?

2019-01-01 回答 CSSsprites 将多张图片合并为一张图片,从而减少浏览器对 HTTP 的请求数量,进而减少网页的加载时间。即使在 HTTP/2 协议下,这依旧可以减少网页的加载时间。在 HTTP/1.1 中,每个 TCP 连接只允许一个请求。现代浏览器虽然可以打开多个(2-8)并行的 TCP 连接,但连接数量依旧有限。HTTP/2 允许浏览器和服务器之间的多个请求在一个 TCP 连接上进行复用。这意味着 TCP 连接

`em` 和 `rem` 有什么区别?

2018-12-31 回答 em 和 rem 都是基于 font-size 的 CSS 属性。唯一的区别是他们继承的对象不同。em 继承父元素中的 font-sizerem 继承根元素(html)中的 font-size 在大多数浏览器中,根元素的 font-size 默认值为 16px 加分回答其他单位 vh 和 vw:窗口高度或宽度的 1/100。可脱离父元素的继承规则,如:窗口高 900px,父元素高 1200px,1vh 为 9px。vmin

focus 有什么效果?应该怎么正确处理他们?

2018-12-30 回答像按钮或锚点标记等元素被选中时,该元素的外围就会出现轮廓。不同浏览器会呈现不同的效果,但一般是在元素周围显示蓝色的轮廓来表示他已经被选中。过去,很多人使用 outline:0 来移除元素被选中的效果。但是,这会让键盘侠们感到很不友好,因为选中效果被移除了。但是如果不移除的话,元素外围的蓝色轮廓有时候会让大多数人感觉不够舒适美观。Bootstrap 等 UI 框架一般采用更加美观的 box

描述 CSS 盒子模型布局并简要描述其每一个部分

2018-12-29 回答 CSS 盒子模型(BoxModel)布局包含内容(content)、内边距(padding)、边框(border)、外边距(margin)四个部分。content:盒子内部填充元素内容(例如文本、图像或视频播放器等)的区域。他的大小为 content-box 的宽和高。相关 CSS 属性为 width,min-width,max-width,height,min-height,max-h

简述一下 `@media` 的媒体类型

2018-12-28 回答 @media 是可根据一个或多个基于媒体特征、媒体类型等条件来使用样式的规则。其包含以下四种媒体类型:all:适用于所有设备,默认选项 print:仅适用于打印设备 screen:仅适用于台式机、平板电脑、手机等屏幕 speech:仅适用于屏幕阅读器加分回答其余的媒体类型:tty,tv,projection,handheld,braille,embossed,aural 在 MediaQ

CSS 预处理器有什么优势?

2018-12-26 回答 CSS 预处理器添加了一些实用的原生 CSS 没有的的功能,并且他通过使用 DRY(Don'tRepeatYourself)原则使生成的 CSS 更加整洁和易于维护。他通过简洁的嵌套选择器语法减少了大量重复代码。变量、颜色函数(lighten,darken,transparentize 等)等附属工具,mixins 及循环使得 CSS 更像一个真正的编程语言,这使开发者编写复杂的 CSS 更加容易了

介绍一下 CSS 的 BEM

2018-12-25 回答 BEM(Block,Element,Modifier)是一种基于组件的对 CSS 类名进行约定的 Web 开发方法。他通过定义命名空间来解决权重问题,从而使 CSS 更易于维护。BEM 使用 Block、Element、Modifier 来解释其结构。Block 是一个可跨项目重用的独立组件,且是子组件(Element)的 “命名空间”。Modifier 可标示 Block 或 Element 处于某种状态

2017 VS 2016 前端使用数据对比

JavaScript 生态系统比以前更加丰富,即使是最有经验的开发人员,在考虑各个阶段可用的众多选项时也会犹豫。这就是调查所在的地方:我们向全世界超过 28,000 名开发人员提出了 100 多个问题,涵盖了从前端库到后端框架。我们相信,结果是目前可用的 JavaScript 状态的最完整的图片,我们很高兴与您分享!附:如果所有这些数据让你倍感压力,我相信今年你一定会大踏步前行。JavaScript 预编译当谈论 J

如何实现 im.qq.com 首页视觉差效果

Demohttp://sym.b3log.org / 源码地址 https://github.com/b3log/index/tree/master/src/main/webapp/sym 原理使用 background-attachment 属性设置背景图像是否固定或者随着页面的其余部分滚动 html 结构 css.bg{position:relative;width:100%;height:600px;backg

不容错过的 Window 8 Metro 风格 UI 资源

颠覆了各种圆角,另一种不错的视觉享受,收藏之。下文转自:http://www.w3cfuns.com/article-915-2.html 微软已经正式发布了 windows8 操作系统,Windows 操作系统的风格已经完全改变成了瓷贴状的 MetroUI。对于微软来说这是一个巨大的改变,而且所有微软的平台,包括桌面、平板、移动及网站都使用这个 UI 风格。MetroUI 包含了所有的现代 web 设计的特点:简化、

国外 29 个开发者实用的 Web(CSS,HTML5,JS)工具和应用

确实不错,转自:http://www.uiimg.com/thread-1482-1-1.html 当你需要编辑或改变网站设计时,CSS 起着重要的作用。透过一些 CSS 工具可以让新手开发人员和设计人员轻松地学习这门语言和它的功能。今天,我们为你编制了 29 个有用的 CSS 工具和应用程序。使用下列工具,您将能够以任何顺序进行 CSS 属性的排序,能够将您的 Photoshop 图层转成 CSS 样式,可以创建自己的响应 W

js 修改 css 文件内样式

outer 了,原来可以直接修改 css 文件内的样式。。。CSS 代码. style1{width:600px;height:400px;background-color:black;}HTML 代码 <html><head><title>cssstyle</title><linkrel="stylesheet"type="text/css"href="./test.css"><scripttype="text

爱上朴实的 CSS 细节

下文转自:爱上朴实的 CSS 细节未来的 CSS 太让人兴奋了:一方面,是全新的页面布局方式;另一方面,是酷炫的滤镜、颜色等视觉效果。这些 CSS,受开发者追捧,被杂志和博客文章铺天盖地地介绍。如果说这些特性是 CSS 华丽的一面,那我们来看看它朴实的一面:很不起眼的东西,如选择器、单位、函数(方法)。我经常说这是繁琐的东西,但我意思是它们能干漂亮的活,这就是我要分享的。怎么说呢,让我们看看这些效果最好的朴实的 C