内容字号:默认大号超大号

段落设置:段首缩进取消段首缩进

字体设置:切换到微软雅黑切换到宋体

当前分类:

> 网页设计 > div+css >

  • 一些编写css的建议01月19日

    javascripty已经走上工程化的道路了,各种mvm,mvvm框架已经让人目不暇接了,这里就不讨论js了。我来讲下我在实际工作中编写CSS的一些经验吧,当然很多人也总结过这样的经验,我说的肯定没有哪些大牛写的好,我只是简单的把自己的工作经验拿出来与大家分享下

    Tags:css
  • CSS书写模式的24种方式01月19日

    由于你可能没有那么多的时间,所以我将从结论开篇。 你可以使用一个不常见,但是非常重要的CSS属性来使文字垂直显示,像下面这样。 除了让文字垂直显示之外,你也可以让图标和入口按钮以这样的方式呈现。当然,可以让你页面上的任何内容按这样方式呈现。 我

    Tags:CSS
  • grid-kiss让网格制作变得更容易01月19日

    去年在 CSS Conf 科普了一下《 CSS Grid Layout 》相关的概念。会后 PostCSS 的作者 @Andrey Sitnik 给我力荐 grid-kiss 这个PostCSS插件。说这个插件可以让CSS Grid变得更为简单。一直都想尝试一下,就是没动手,今天体验了一下,还是很有意思的。今天花点

    Tags:CSS
  • CSS3特性修改(自定义)浏览器默认滚动条01月18日

    前言:我们做前端时,会遇到一些需求,要求把默认浏览器的滚动条样式给改写了,诶。好好的改它干啥了,也带不来用户体验,就是好看点嘛!实现原理其实是用了伪元素,webkit的伪元素实现很强,可以把滚动条当成一个页面元素来定义,再结合一些CSS3属性,比如

    Tags:CSS3
  • 让CSS更完美:PostCSS-modules01月18日

    译者注( GeoffZhu ): 这篇适合一些使用过预处理CSS的开发者,比如less,sass或stylus,如果你都没用过,那你一定不是个好司机。在PostCSS中早就可以使用CSS Modules了,该篇作者贡献了一个新工具,可以让更多开发者方便的使用最新的CSS Modules。 我们和全

    Tags:PostCSSmodules
  • Web前端开发规范01月18日

    这几天一直在梳理关于前端方面的开发规范,现在暂时梳理了HTML的开发规范,暂且放置于此! 规范目的: 使开发流程更加规范化 文件命名规范:(需审批) 1.项目命名 全部采用小写方式, 以下划线分隔。 例:my_project_name 2.目录命名 参照项目命名规则; 有复

    Tags:Web前端前端开发
  • 聊聊CSS Shapes规范的下一个版本01月18日

    在前面的教程中,看到了怎么创建CSS Shapes,即在元素定认一个规则图形。里面都是些基础的知识,比如说创建一个圆,然后多行文本围绕这个圆。在这篇文章中,我们将探索一些更复杂的图形,让你的布局不在局限于四四方方的图形中。 创建多边形 除了可以创建圆和

    Tags:CSSShapes
  • PWA渐进式实践(3):用户体验 & 性能(97分的PWA)01月18日

    为了让我们的网站能达到更高的评分(咦,为什么变成刷分了),我们最后需要进行用户体验和性能的优化。 页面加载性能 我们需要尽可能把其他所有页面做成异步的,如: function getSubmitCase (nextState, callback) { require .ensure([], ( require ) = { c

    Tags:PWA
  • CSS3:图片翻页效果的展示01月18日

    在开发一个网站的过程中各种翻页效果数不胜数,在这里我将介绍一下简单的一种方法就是使用css3的旋转即可实现这种常见的效果; 显示效果如下: 首先是页面的布局,不用那么复杂; a标签的href属性,一般指向一个URL地址,也可以调用javascript,如href=javasc

    Tags:CSS3图片翻页
  • ColorMe:可视化CSS颜色属性工具01月18日

    一个简单CSS 的颜色设置工具,这个工具特色就是有个强大的调节器来定义 CSS Color 值。这工具可能对于前端人员比较实用。 调节器有:透明度、饱和度、色调、亮度、着色、阴影、R/G/B、白色、黑色、对比度的设置,设置任何一个值都能实时输出 RGB 值。 工具名

    Tags:ColorMeCSS
  • 动态加载css方法实现和深入解析01月18日

    一、方法引用来源和应用 此动态加载css方法 loadCss,剥离自Sea.js,并做了进一步的优化(优化代码后续会进行分析)。 因为公司项目需要用到懒加载来提高网站加载速度,所以将非首屏渲染必需的css文件进行动态加载操作。 二、优化后的完整代码 /** @function

    Tags:css
  • 纯CSS3实现不错的表单验证效果01月18日

    今天继续学习Web表单相关的内容,不过今天重点落实到实战中,利用HTML5表单与CSS3-UI实现一款不错的表单效果。 效果可看下面动图: 如效果演示,我们今天就通过简单几行CSS就可实现。 预备知识 1、HTML5新增的表单类型:tel、email、url(上一篇有介绍) 2、

    Tags:CSS3表单
  • 简单聊一聊CSS全局样式和表格样式(附有源码)01月18日

    1、布局容器类样式:.container 和 .container-fluid .container 固定宽度并且具有响应式。.container-fluid 自由宽度(100%宽度)。 这2个class是直接在body标签下建立一个div标签,class等于这2个中的一个。 然后其他内容全部写在这个div标签中即可! 例如:

    Tags:CSS全局样式表格样式
  • CSS动画之工具、框架和教程01月18日

    CSS 动画之工具、框架和教程 在这篇文章中,我们将不讨论 使用 CSS 动画的好处 ,也不会谈论 JS 动画是否比 CSS 动画更快 ,而是与你分享一些 CSS 工具,框架和教程。它们将有助于缓解你在学习 CSS 动画中的困扰,并帮助你节省一些时间。 CSS 动画工具和框架

    Tags:CSS
  • 两个viewport的故事第一部分01月18日

    在这个系列文章中,我将说明viewports和重要元素的宽度是如何工作的,比如 html 元素、window和 scrren的宽度。 这篇文章是关于桌面浏览器的,目的是为介绍移动浏览器做好准备。大部分的web开发者已经对桌面浏览器的一些概念很熟悉了。在移动浏览器上我们会

    Tags:viewport
  • 巧用css text-indent减小中文标点符号的占位大小01月18日

    由于设计需要,我们的页面中经常会有如下效果: 可是我们实现出来的效果确实这样的: 看起来两行文本没有对齐嘛,仔细检查后原来是 【 字符的原因,因为是中文标点符号 占半个字的位置 。不信?选中下汉字标点符号看一下即可。至于为什么会占半个字的位置,

    Tags:csstext-indent
  • 从Sass过渡到PostCSS01月18日

    Sass多年来一直是我的首

    Tags:SassPostCSS
  • css3:背景属性background-origin/clip详解01月17日

    前言 好了,最近进度有点慢了,继续来发css3的教程,写完css3背景属性之后我去研究下Google 开发者调试工具之webapp调试工具栏。智能手机的出现让HTML5+CSS3有了一个全新的舞台去演绎。很多的单页面都应用到了css3的酷炫效果,所以捣腾一下webapp开发工具应

    Tags:css3background
  • CSS兼容攻略01月17日

    平常要多留心,摸不准兼容如何就该多看看 can i use ,额,还有就是自己要明白页面该兼容到什么程度 1 是否需要兼容 一上来得把这个问题想好,有些效果不兼容就不兼容呗,只要后退平稳即可, 如这种情况下的CSS Shapes: 图片来自 w3cplus ,这种情况下,对

    Tags:CSS
  • CSS实现导航条Tab切换的三种方法01月14日

    前面的话 导航条Tab在页面中非常常见,本文说详细介绍CSS实现导航条Tab的三种方法 布局 根据上图所示,先规定几个定义,上图的模块整体叫做导航,由导航标题和导航内容组成。要实现上图所示的布局效果,有两种布局方法:语义布局和视觉布局 【语义布局】 从

    Tags:CSSTab

CopyRight © 2015-2016 QingPingShan.com , All Rights Reserved.

清屏网 版权所有 豫ICP备15026204号