- 浏览: 2163006 次
- 性别:
- 来自: 上海
文章分类
- 全部博客 (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> ...