- 浏览: 2162960 次
- 性别:
- 来自: 上海
-
文章分类
- 全部博客 (1878)
- [网站分类]ASP.NET (141)
- [网站分类]C# (80)
- [随笔分类]NET知识库 (80)
- [随笔分类]摘抄文字[非技术] (3)
- [随笔分类]养生保健 (4)
- [网站分类]读书区 (16)
- [随笔分类]赚钱 (7)
- [网站分类].NET新手区 (233)
- [随笔分类]网站 (75)
- [网站分类]企业信息化其他 (4)
- [网站分类]首页候选区 (34)
- [网站分类]转载区 (12)
- [网站分类]SQL Server (16)
- [网站分类]程序人生 (7)
- [网站分类]WinForm (2)
- [随笔分类]错误集 (12)
- [网站分类]JavaScript (3)
- [随笔分类]小说九鼎记 (69)
- [随笔分类]技术文章 (15)
- [网站分类]求职面试 (3)
- [网站分类]其他技术区 (6)
- [网站分类]非技术区 (10)
- [发布至博客园首页] (5)
- [网站分类]jQuery (6)
- [网站分类].NET精华区 (6)
- [网站分类]Html/Css (10)
- [随笔分类]加速及SEO (10)
- [网站分类]Google开发 (4)
- [随笔分类]旅游备注 (2)
- [网站分类]架构设计 (3)
- [网站分类]Linux (23)
- [随笔分类]重要注册 (3)
- [随笔分类]Linux+PHP (10)
- [网站分类]PHP (11)
- [网站分类]VS2010 (2)
- [网站分类]CLR (1)
- [网站分类]C++ (1)
- [网站分类]ASP.NET MVC (2)
- [网站分类]项目与团队管理 (1)
- [随笔分类]个人总结 (1)
- [随笔分类]问题集 (3)
- [网站分类]代码与软件发布 (1)
- [网站分类]Android开发 (1)
- [网站分类]MySQL (1)
- [网站分类]开源研究 (6)
- ddd (0)
- 好久没写blog了 (0)
- sqlserver (2)
最新评论
-
JamesLiuX：
博主，能组个队么，我是Freelancer新手。
Freelancer.com（原GAF – GetAFreelancer）帐户里的钱如何取出？ -
yw10260609：
我认为在混淆前，最好把相关代码备份一下比较好，不然项目完成后， ...
DotFuscator 小记 -
日月葬花魂：
大哥 能 加我个QQ 交流一下嘛 ？51264722 我Q ...
web应用程序和Web网站区别 -
iaimg：
我想问下嵌入delphi写的程序总是出现窗体后面感觉有个主窗体 ...
C#自定义控件：WinForm将其它应用程序窗体嵌入自己内部 -
iaimg：
代码地址下不了啊！
C#自定义控件：WinForm将其它应用程序窗体嵌入自己内部
CSS书写顺序
*{
/*显示属性*/
display
position
float
clear
cursor
…
/*盒模型*/
margin
padding
width
height
/*排版*/
vertical-align
white-space
text-decoration
text-align
…
/*文字*/
color
font
content
/*边框背景 为什么要把 boder和background放在最后的原因是修改的频率会较之前的频繁，放在最后查看起来方便，哈哈。*/
border
background
}
下表顺序为从上到下，从左到右：
========================
display || visibility
list-style : list-style-type || list-style-position || list-style-image
position
top || right || bottom || left
z-index
clear
float
width
max-width || min-width
height
max-height || min-height
overflow || clip
margin : margin-top || margin-right || margin-bottom || margin-left
padding : padding-top || padding-right || padding-bottom || padding-left
outline : outline-color || outline-style || outline-width
border
background : background-color || background-image || background-repeat || background-attachment || background-position
color
font : font-style || font-variant || font-weight || font-size || line-height || font-family
font : caption | icon | menu | message-box | small-caption | status-bar
text-overflow
text-align
text-indent
line-height
white-space
vertical-align
cursor
CSS命名规则：
一．文件命名规范
全局样式：global.css；
框架布局：layout.css；
字体样式：font.css；
链接样式：link.css；
打印样式：print.css；
主要的 master.css
专栏 columns.css
主题 themes.css
主要的 master.css
模块 module.css
基本共用 base.css
表单 forms.css
补丁 mend.css
二．页面结构
容 器: container
页 头：header
内 容：content
页面主体：main
页 尾：footer
栏目：column
页面外围控制整体布局宽度：wrapper
左右中：left right center
三．导航
导航：nav
主导航：mainbav
子导航：subnav
顶导航：topnav
边导航：sidebar
左导航：leftsidebar
右导航：rightsidebar
菜单：menu
子菜单：submenu
摘要: summary
四．功能
标志：logo
广告：banner
登陆：login
登录条：loginbar
注册：regsiter
搜索：search
功能区：shop
标题：title
加入：joinus
状态：status
按钮：btn
滚动：scroll
标签页：tab
文章列表：list
提示信息：msg
当前的: current
小技巧：tips
图标: icon
注释：note
指南：guild
服务：service
热点：hot
新闻：news
下载：download
投票：vote
合作伙伴：partner
友情链接：link
版权：copyright
|
Container div |
#container |
容器 |
|
Layout |
#layout |
布局 |
|
Header or banner div |
#head, #header |
页头部分 |
|
Footer div |
#foot, #footer |
页脚部分 |
|
Navigation list |
#nav |
主导航 |
|
Sub-navigation list |
#subNav |
二级导航 |
|
Menu |
#menu |
菜单 |
|
Sub Menu |
#submenu |
子菜单 |
|
Left or right side columns |
#sidebar_a, #sidebar_b |
左边栏或右边栏 |
|
Main div |
#main |
页面主体 |
|
Tag |
#tag |
标签 |
|
Message |
#msg #message |
提示信息 |
|
Tips |
#tips |
小技巧 |
|
Vote |
#vote |
投票 |
|
Friend Link |
#friendlink |
友情连接 |
|
Title |
#title |
标题 |
|
Summary |
#summary |
摘要 |
|
Search input |
#searchInput |
搜索输入框 |
|
Search output |
#search_output |
搜索输出和搜索结果相似 |
|
Search |
#search |
搜索 |
|
Search bar |
#searchBar |
搜索条 |
|
Search results |
#search_results |
搜索结果 |
|
Copyright information |
#copyright |
版权信息 |
|
brand |
#branding |
商标 |
|
branding-logo |
#logo |
LOGO |
|
Site information |
#siteinfo |
网站信息 |
|
Copyright information etc. |
#siteinfoLegal |
法律声明 |
|
Designer or other credits |
#siteinfoCredits |
信誉 |
|
Join us |
#joinus |
加入我们 |
|
Partnership opportunities |
#partner |
合作伙伴 |
|
Services |
#service |
服务 |
|
Regsiter |
#regsiter |
注册 |
|
Arrow |
arr/arrow |
箭头 |
|
Little |
#little |
标题 |
|
Website map |
#sitemap |
网站地图 |
|
List |
#list |
列表 |
|
Home page |
#homepage |
首页 |
|
Sub page |
subpage |
二级页面子页面 |
|
Toolbar |
#tool, #toolbar |
工具条 |
|
Next pulls |
#drop |
下拉 |
|
Next pulls menu |
#dorpmenu |
下拉菜单 |
|
Status |
#status |
状态 |
|
Container div |
#container |
容器 |
|
Header or banner div |
#header |
页头部分 |
|
Main or global navigation div |
#mainNav |
主导航 |
|
Menu |
#menu |
菜单 |
|
Sub Menu |
#submenu |
子菜单 |
|
Left or right side columns |
#sidebarA, #sidebarB |
左边栏或右边栏 |
|
Main div |
#main |
页面主体 |
|
Content div |
#content |
内容部分 |
|
The main content area |
#contentMain |
主要内容区域 |
|
Footer div |
#footer |
页脚部分 |
|
Tag |
#tag |
标签 |
|
Message |
#msg #message |
提示信息 |
|
Tips |
#tips |
小技巧 |
|
Vote |
#vote |
投票 |
|
Friend Link |
#friendlink |
友情连接 |
|
Title |
#title |
标题 |
|
Summary |
#summary |
摘要 |
|
Sub-navigation list |
#subNav |
二级导航 |
|
Search input |
#searchInput |
搜索输入框 |
|
Search output |
#searchOutput |
搜索输出和搜索结果相似 |
|
Search |
#search |
搜索 |
|
Search results |
#searchResults |
搜索结果 |
|
Copyright information |
#copyright |
版权信息 |
|
brand |
#branding |
商标 |
|
branding-logo |
#brandingLogo |
LOGO |
|
Site information |
#siteinfo |
网站信息 |
|
Copyright information etc. |
#siteinfoLegal |
法律声明 |
|
Designer or other credits |
#siteinfoCredits |
信誉 |
|
Join us |
#joinus |
加入我们 < 分享到：
发表评论
|
相关推荐
本资料“CSS_命名规范参考及书写注意事项”将为你提供相关的指导原则。 1. BEM（Block Element Modifier）命名法：BEM是一种流行的CSS命名方法，由Yandex公司提出。它的核心理念是将CSS类名分为三部分：Block（块）...
在Web前端开发中，CSS（层叠样式表）命名规范是至关...在实际工作中，可以参考提供的文档资源，如`CSS命名规范参考及书写注意事项.doc`、`WEB前端开发规范.doc`，以及`HTML+css PPT浅谈.rar`，深入理解并应用这些规范。
CSS2.0中文手册.chm+CSS 命名规范参考及书写注意事项.chm+CSS_3.0.chm+DHTML 参考手册 - 颜色表.mht+Html DOM 手册.CHM+Html和css网页标准指南.chm+JavaScript参考手册E.chm+Javascript高级教程.CHM+JavaScript使用...
#### 常用CSS命名规则 - **通用结构**：例如`.header`, `.content`, `.footer`等。 - **导航结构**：例如`.nav`, `.sidebar`, `.submenu`等。 - **功能组件**：例如`.logo`, `.banner`, `.search`等。 - **状态标识...
本文将详细介绍CSS命名及书写方面的一系列最佳实践。 #### CSS书写顺序 在编写CSS时，按照一定的顺序组织属性可以提高代码的整洁度，便于后续的阅读与维护。通常推荐的顺序如下： 1. **位置属性**：包括`position...
### CSS属性编写顺序及命名规范 #### 一、书写顺序 ...通过遵循以上CSS属性编写顺序、注意事项及命名规范，可以显著提升前端项目的质量和可维护性，帮助开发者构建更加高效、易维护的网站或应用。
在编写CSS命名规则时，常见的命名包括头部（header）、内容（content/container）、尾部（footer）、导航（nav）、侧栏（sidebar）、栏目（column）、页面外围控制布局宽度（wrapper）、左右中（left/right/center）...
### CSS命名规则与实践 #### 文件命名规范 在进行网页设计时，良好的文件命名习惯能够极大地提高工作效率并便于团队协作。以下是一些常用的CSS文件命名规范： - **全局样式**：`global.css`，用于存放整个网站...
书写顺序的意义 减少浏览器reflow（回流），提升浏览器渲染dom的性能 ①:解析html构建dom树，解析css构建css树：将html解析成树形的数据结构，将css解析成树形的数据结构 ②:构建render树：DOM树和CSS树合并之后形成...
9. **CSS命名规范**： - 头部：header - 内容：content/container - 尾部：footer - 导航：nav - 侧栏：sidebar - 栏目：column - 页面宽度：wrapper - 左右中：left, right, center - 登录：loginbar - ...
在编写CSS时，遵循一定的书写规范、顺序和命名规则至关重要，因为这不仅有助于提升代码的可读性，还可以促进团队间的协作效率。以下是一些关于CSS书写规范、顺序和命名规则的详细说明： **一、CSS书写顺序** 1. **...
#### 六、其他书写注意事项 **1. 鼠标手势** 使用 `pointer` 而不是 `hand` 来表示鼠标悬停时的手势。 **2. 代码缩写** 尽可能地使用缩写形式，比如将 `.white{#ffffff}` 缩写为 `.white{#fff}`。 以上就是关于...
#### 六、修改全站级CSS的注意事项 - 不建议轻易修改全站级CSS文件，因为这可能会影响到整个站点的外观和功能。若确实需要修改，务必进行全面的测试以确保不会引入新的问题。 #### 七、CSS规则的书写格式 1. 属性...
以上内容覆盖了CSS书写顺序、书写规范、注意事项、文件命名以及Flash和JavaScript交互的基本概念，还包括了JavaScript数组常用方法的总结，这些都是前端开发者面试和实际工作中经常会遇到的问题点。
在其他注意事项中，提出了代码书写的最佳实践，包括一律使用小写字母、尽量使用英文命名、不使用中杠和下划线、尽量不使用缩写等原则。这些规则有助于确保代码风格的统一，减少歧义。 对于CSS文件的命名，也提供了...
- **注意事项**: 页面中每个 ID 必须是唯一的。 **Class 选择符** - **定义**: 类选择符允许为多个元素定义相同的样式。 - **示例**: ```html <div class="font1"></div> <p class="font1"></p> ...