基础
来源:互联网 发布:安娜伊思马田 知乎 编辑:程序博客网 时间:2024/04/29 13:56
类别选择符:
p.bold {font-weight: bold;}
<p class="blod"> 这个段落应该是粗体的.</p>
ID选择符:
p#bold {font-weight:bold;}
<p id="bold"> 这个段落应该是粗体的</p>
群选择符:
p,h1,h2 {text-align:left; }
p.bold,h1#title{ font-weight:bold;}
颜色:
p {color:red;}
5种定义颜色的方法:
value Description
color:<color keyword> 设置颜色的给定值
color:#rrggbb 用HTML的16位进制来表示
color:rgb(rrr,ggg,bbb) RGB(0-250)
color:rgb(rrr%,ggg%,bbb%) RGB百分比
color:inherit 继承父值
边框:border-top;border-bottom;border-right;border-left;
img.thumb{
border-color:red;
border-width:12px;
border-style(风格):dotted;
}
边界距:
是用来指定两个元素边框的距离。
img{margin:0px;}
body{margin:0px;}
填充:
padding-top
padding-right
padding-borttom
padding-left
padding
img#id{padding:40px;}
背景图片:
在CSS可对任何元素添加背景图片。
body{ background-image:url();}
background-image: url("<location>") 通过网址来指定背景图片
background-image: none 无背景图片
background-image: inherit 继承父值
背景重复:
你可以对背景显示方式进行微调,通过background-repeat属性,你可以指定背景的重复方式
background-repeat:repeat 重复(默认)
background-repeat:repeat-X 仅平行重复
background-repeat:repeat-y 仅垂直重复
background-repeat:no-repeat 不重复
background-repeat:inherit 继承父值
背景附着:
background-attachment:fixed 固定
background-attachment:scroll 滚动
background-attachment:inherit继承父值
背景定位:
background-position:<x><y> 用具体数值或百分比指定。
例子:background-position:100px 100px
background-position: [top|center|bottom] 用关键字定位。
[left|center|right]
字体属性:
font-family:
字体风格:控制字体是否为斜体.
font-style: oblique
font-style: italic
font-style: normal
字体粗细:
font-weight:bold
font-weight:normal
font=weight:bolder
font-weight:lighter
font-weight<100-900>
字体的大小:
font-size:12pt
font-size:12px
font-size:normal
font-size:larger
font-size:medium
font-size:50%
行间距:
line-height:14px
line-height:2em
字体变量:
font-variant:normal
font-variant:small-caps
- 基础
- 基础
- 基础
- 基础
- 基础
- 基础
- 基础
- 基础
- 基础
- 基础
- 基础
- 基础
- 基础
- 基础
- 基础
- 基础
- 基础
- 基础
- 国庆节
- Nand Flash数据存储规则与数据读写方法一二三
- 关于英语单词单复数转换方法在程序中的实现
- 分享网站建设大概流程
- 列宽与布局
- 基础
- java中数据类型转换 Integer String Long Float Double Date
- 如何避免Quartus II自動將未宣告的信號視為wire? (SOC) (Verilog) (Quartus II)
- [转]wince 蓝牙
- 减少Qt编译时间暨简单Qt裁剪
- BOOST::Signals2 / “观察者模式” 趣味分析——Eric要参加刘德华的演唱会却不知道时间,怎么办?
- jquery autocomplete插件的使用
- 海量数据处理专题(一)——开篇
- 海量数据处理专题(二)——Bloom Filter