`
idisc
  • 浏览: 36116 次
  • 性别: Icon_minigender_1
  • 来自: 秦皇岛
最近访客 更多访客>>
社区版块
存档分类
最新评论

CSS编写应该注意的15个问题

    博客分类:
  • ruby
阅读更多

        1、不要使用过小的图片做背景平铺。这就是为何很多人都不用 1px 的原因,这才知晓。宽高 1px 的图片平铺出一个宽高 200px 的区域,需要 200*200=40, 000 次,占用资源。

  2、无边框。推荐的写法是 border:none;,哈哈,我一直在用这个。 border:0; 只是定义边框宽度为零,但边框样式、颜色还是会被浏览器解析,占用资源。

  3、慎用 * 通配符。所谓通配符,就是将 CSS 中的所有标签均初始化,不管用的不用的,过时的先进的,一视同仁,这样,大大的占用资源。要有选择的初始化标签。

  4、CSS 的十六进制颜色代码缩写。习惯了缩写及小写,这才知道,原来不是推荐的写法,为的是减少解析所占用的资源。但同时会增加文件体积。孰优孰劣,有待仔细考证。

  5、样式放头上,脚本放脚下。不内嵌,只外链。

  6、坚决不用 CSS 表达式。

  7、使用引用样式表,而不是通过 @import 导入。

  8、一般来说,PNG 比 GIF 要小,小得多。再者,GIF 中有多少颜色是被浪费的,很值得优化。

  9、千万不要在 HTML 中缩放图片,一者不好看,二者占资源。

  10、正文字体最好用偶数,12px、14px、16px,效果非常好。特例,15px。

  11、block、ul、ol 等上下留出至少一倍行距,左侧至少两倍行距,右侧随意。

  12、段落之间,至少要有一倍行距。

  13、强行指定某些元素的 line-height,正文 1.6 倍于文字大小,标题 1.3 倍。

  14、中文标点用全角。英文夹杂在中文中,左右空格,半角。

  15、中文字体的粗体和斜体,远离较好,利民利己。

 

        做小游戏 站时需要注意并且遵循它

 

分享到:
评论

相关推荐

    用HTML+div+css编写的一个旅游网站的编写

    在编写HTML和CSS时,需要注意不同浏览器对某些特性的支持程度,如IE浏览器可能不支持一些较新的CSS特性。为了确保所有用户都能正常访问,开发者可能需要使用前缀(-webkit-、-moz-等)或使用polyfill库。 综上所述,...

    TopStyle(CSS编写工具)

    **TopStyle:CSS编写工具详解** TopStyle是一款专为网页设计师设计的专业级CSS(层叠样式表)编写工具。在Web开发中,CSS是至关重要的,它负责定义网页的布局、颜色、字体等视觉效果。TopStyle凭借其强大的功能和...

    css基础教程--CSS快速入门、怎样编写CSS、CSS属性、CSS定位、CSS滤镜 

    编写CSS时,需要注意以下几点: - 语法规范:每个属性名后跟冒号,属性值后跟分号。 - 嵌套规则:使用空格将嵌套的选择器与父选择器分开。 - 优先级:内联样式>内部样式(`<style>`标签)>外部样式表。 - 继承...

    CSS+DIV编写经验总结之CSS样式小模板

    ### CSS+DIV编写经验总结之CSS样式小模板 #### 概述 随着互联网技术的不断发展,Web前端设计已经成为了一个至关重要的领域。对于前端开发者来说,掌握CSS+DIV布局技巧是必不可少的一项技能。本文将根据提供的内容...

    在Dreamweaver中编写CSS需要掌握的技巧.

    下面将详细介绍在Dreamweaver中编写CSS时需要注意的一些核心技巧。 #### 1. CSS样式表类型的理解与选择 在Dreamweaver中编写CSS时,首先需要理解不同类型的CSS样式表及其应用场景: - **内联样式(Inline Styles...

    react-使用css编写reactnative样式

    在React Native中,尽管主要使用...总之,`react-native-css-file`为React Native开发者提供了使用CSS编写样式的可能性,使得从Web开发转向React Native的迁移变得更加平滑,同时提升了代码的可维护性和团队协作效率。

    CSS插件工具箱--使用JavaScript和HTML5编写的100个CSS动态网站插件

    "CSS插件工具箱——使用JavaScript和HTML5编写的100个CSS动态网站插件"正是这样一份宝贵的资源,它集合了100个精心设计的插件,旨在帮助开发者轻松实现各种复杂的视觉效果和交互功能。 ### CSS插件的类型 这个工具...

    高效编写CSS代码的建议汇总

    在编写CSS时,如果遇到多个选择器具有相似的属性和值,应该考虑将这些相似部分抽取出来,使用类组合的方式统一定义。这样做不仅可以减少代码量,还能提高代码的可维护性。例如,如果有多个类需要相同的定位属性,...

    CSS常见浏览器兼容问题

    预处理器如Sass和Less则允许编写更灵活的CSS代码,减少兼容性问题。 5. 使用 normalize.css 或 reset.css: 这些CSS文件可以重置所有浏览器的默认样式,使各浏览器的样式起点一致,减少因默认样式差异导致的问题。...

    CSS属性编写顺序及命名规范

    ### CSS属性编写顺序及命名规范 #### 一、书写顺序 ...通过遵循以上CSS属性编写顺序、注意事项及命名规范,可以显著提升前端项目的质量和可维护性,帮助开发者构建更加高效、易维护的网站或应用。

    hbuilder css格式化css为单行代码

    找到文件后,用户可以下载或编写一个新的beautify-css.js版本,这个新版本应包含将CSS代码格式化为单行的逻辑。替换完成后,重启HBuilder,以便使更改生效。 在进行这类操作时,需要注意以下几点: 1. 备份原始文件...

    高效、可维护、组件化的CSS

    总结以上内容,要编写高效、可维护且组件化的CSS,需要注意以下几点: 1. 使用外部样式表来集中管理和复用样式。 2. 避免使用行内样式和内嵌样式,尽量使用link标签代替@import导入外部CSS。 3. 掌握并运用CSS书写...

    visualcss CSS 编辑可视工具

    "visualcss CSS 编辑工具"正是为了解决这一问题而诞生,它提供了一个可视化的编辑环境,让用户在编写CSS的同时能够实时预览效果,极大地提高了设计效率。 CSS编辑工具的核心功能是帮助开发者更轻松地管理和编辑CSS...

    超强兼容对联广告代码 纯CSS样式编写

    纯CSS编写对联广告代码的核心在于布局和定位。CSS的布局模式,如流式布局(Flow)、浮动布局(Float)、绝对定位(Positioning)和Flexbox(弹性盒模型)或Grid(网格布局)都可以用来实现对联广告的效果。考虑到...

    Emmet for Sublime Text 3 HTML/CSS代码快速编写神器

    Sublime Text 3的HTML/CSS代码快速编写神器:Emmet,使用方法:直接解压到Sublime Text 3安装路径下,如C:\Software\Sublime Text3\Emmet,注意Emmet文件名的大小写。

    birt公用CSS样式

    3. 使用说明.txt:这是一个文本文件,可能包含了如何在BIRT报表中引入和使用birt.css的步骤,以及可能的注意事项。比如,如何在BIRT报表设计环境中导入CSS文件,如何在报表元素上应用样式类,或者如何自定义样式以...

    CSS格式化工具

    理解并遵循良好的CSS编写习惯,结合工具使用,才能真正提升代码质量。 7. **安装与配置** CSS格式化工具通常有npm包或扩展插件形式,可以方便地安装在Visual Studio Code、Sublime Text、Atom等主流代码编辑器中。...

    css sprites工具 bg2css_1.4.1

    "bg2css_1.4.1" 是一个专门用于生成CSS Sprites样式的工具,它可以帮助开发者更方便、准确地定位和设置精灵图中各个小图的位置和大小,从而简化CSS代码的编写。 **一、CSS Sprites工作原理** 1. **合并图像**:...

Global site tag (gtag.js) - Google Analytics