MUXC.CC

HTML+CSS
事件 鼠标单击     click() 鼠标双击     dblclick() 鼠标经过     mouseenter() 鼠标离开     mouseleave() 鼠标按下     mousedown() 鼠标松开     mouseup() 鼠标经过     hover() 获取焦点     focus() 失去焦点     blur() 常用语法 选择所有      $("*") 选择当前      $(this) 选择p标签    $("p.intro") 选择第一个p标签   $("p:first") 选择ul里面第一个li标签                      $("ul li:first") 类型 font-family        字体 font-size        字体大小 font-style       字体样式 italic         斜体 oblique   偏斜体 line-height    行间距/行高 font-weight   字体粗细 font-variant   字体变形 small-caps    小型大写字母 text-decoration     文本修饰 underline     下划线 overline    上划线 line-through    删除线 blink    闪烁 none    无 color     颜色 背景 background-color      背景颜色 background-image    背景图片 background-repeat    背景重复 background-attachment   附件 fixed     固定的 scroll    滚动 background-psoition(x)                               背景水平位置 background-position(y)                             背景垂直位置 right       右对齐 center        居中对齐 left         左对齐 区块 word-spacing    单词间距 letter-spacing    字母间距 vertical-align     垂直对齐 baseline    基线 sub       下标 super    上标 top        顶部 text-top    文本顶对齐 middle    中线对齐 bottom    底部 text-bottom    文本底对齐 text-align        文本对齐 text-indent    文本缩进 white-space   空格 normal    正常 pre   保留 nowrap    不换行 display   显示 inline     内嵌 block   块 list-item  列表项 run-in     追加部分 inline-block    内联块 compact   紧凑 marker     标记 table     表格 inline-table   内嵌表格 table-row-group    表格行组 table-header-group                          表格标题组 table-footer-group                      表格注脚组 table-row     表格行 table-column-group    表格列组 table-column     表格列 table-cell     表格单元格 table-caption   表格标题 inherit     继承 方框 width      宽度 height    高度 float   浮动 clear   清楚 padding   填充(边距) margin      边界 top   上 right     右 bottom   下 left     左

边框
style        样式
dotted     点划线
dashed    虚线
solid    实线
double    双线
groove   槽状
ridge       脊状
inset       凹陷
outset    突出
width      宽度
color       颜色


列表
list-style-type       类型
disc        圆点
circle      圆圈
square   方块
decimal  数字
lower-roman   小写罗马数字
upper-roman   大写罗马数字
lower-alpha     小写字母
upper-alpha    大写字母
list-style-image  
                        项目符号图像
list-style-position   位置
inside         内
outside       外


定位
position       位置
absolute      绝对
fixed      固定
relative       相对
static       静态
visibility   显示
inherit      继承
visible      可见
hidden   隐藏
width      宽度
z-index   Z轴
height     高度
overflow   溢出
scroll    滚动
placement    定位
clip     剪辑



列表
page-break-before     之前
page-break-after        之后
auto                            自动
always                        总是
cursor                         光标
filter       过滤器



HTML常用
title    标题
body   身体
list     列表
style      样式
link   链接
italic     斜体
bold   加粗
input   输入
under    下面的
size     大小
text     文本
align   对齐
decoration    修饰
line    线


width    宽
height   高
backgroung    背景
repeat     重复
position   位置
list    列表
style    样式
borde    边框
line-heght    行高
image   图像
source   资源
width    宽度
heght   高度
line    行
top   顶部


页面结构
容器        container
页头        header
内容        content/container
页面主体  main
页尾         footer
导航         nav
侧栏         Sidebar
栏目         column
页面外围控制整体布局宽度
                wrapper
左右中      left/right/center





















导航
导航          nav
主导航       mainbav
子导航       subnav
顶导航       topnav
边导航       sidebar
左导航       leftsidebar
右导航       rightsidebar
菜单          menu
子菜单      submenu
标题          title
摘要          summary


CSS常用
font     字体
through    穿过
inrough    缩进
indent    斜体
bold      加粗
weight   加重
display  显示类型
visibility     显示可见
hidden   隐藏
visible    显示
overflow   溢出
margin     边界
padding   填充
normal    正常


功能
标志    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
友情链接    friendlink
版权    copyright


颜色
使用颜色的名称或者16进制代码,如
.red{color:red;}
.f60{color:#f60;}
.ff8600{color:#ff8600;}


字体大小
使直接使用“font+字体大小”作为名称,如
.font12px{font-size:12px;}
.font9pt{font-size:9pt;}

对齐样式
使用对齐目标的英文名称,如
.left{float:left;}
.bottom{float:bottom;}

标题栏样式
使用“类别+功能”的方式命名,如
.barnews{ }
.barproduct{ }

样式文件命名
主要的     master.css
模块     module.css
基本共用     base.css
布局/版面      layout.css
主题           themes.css
专栏          columns.css
文字           font.css
表单           forms.css
补丁           mend.css
打印           print.css

HTML5文本标签
强调标记      em
加重标记     strong
视频标记       video
音频标记      audio
制图标记      canvas

扩展
之前    page-break-before
之后    page-break-after
自动    auto
总是    always
光标    cursor
过滤器     filter

函数
普通函数      function(){  }

动画
自定义动画          adimate
注意事项
一律小写
尽量用英文
不加中杠(-)和下划线
尽量不缩写,除非一看就明白的单词。
英文单词-(含发音).pptx
1.22MB下载