Cloud Yellow
来自CloudWiki
目录
第一部分网页
一:网页css 样式属性
背景字符颜色:color:red yellow black white 字间距: letter –spacing 带单位的固定数值 单词间距:word-spacing 带单位的固定数值 行间距: line-height 装饰:text-decoration : none无 underline 下划线 overline 上划线 line-through 删除线 blink 闪烁 水平对齐方式: text-aline : left right center justify两端对齐 首行缩进量:text-indent 切断单词: word-wrap 书写方向:diection 字体集:font-family 字号大小:font-size 风格样式:font-style:normal常规 bold 粗 bolder 更粗
二:盒子
高度:height 宽度 width 内填充:padding 一个值时四个方向填充相同,两个值时上下,左右;三个值时上,左右,下;四个值时 上右下左。 外边距:margin (同上) 盒子边框样式:border-style:none无 ;hidden隐藏;dottted 点线 ;dashed虚线; solid 实线;double 双实线;groove勾线;ridge脊线;inset内陷;outset外凸。 边框的半角;border-radious:10% 边框的宽度:border-width 边框的颜色;border-color 背景颜色:background-color 背景图片:background-image:URL(图像url) 背景色:background。
三:盒子的浮动与清除
(1):只要盒子设置上浮动属性,那么其后的某个盒子一定要把这种浮动清除掉。 浮动:float:none;left;right ;不浮动 ,左浮动,右浮动。 清除浮动:clear:none;both;left;right (2):若想使盒子中的文本垂直居中,则需将文字的行高line-height 设置为盒子的高度。 插入图像 ;<img src =”图像链接或图像位置”/>
五:简单的网页
简单代码:
<html> <head> <title>…………….</title> <style type =”text/css”> </style> </head> <body>
</body> </html>
六:文本及相关标记
- (1):上下标记a<sup>2</sup>+b<sup>2</sup>=c <sup>2</sup> 即:a2+b2=c2.。<sub>下标文本</sub>.
- (2):文本修饰标记 :加粗:<b>加粗文本</b>或<strong>。。。。。。。。。</strong>
- 斜体:<i>斜体文本</i>或<em>。。。。。。</em>。
- 删除线:<s>………</s>或<strike>………..</strike>或<del>……..</del>
- 下划线:<u>…………</u>
- (3):换行标记:<br/>
七:图像的样式
设置图像宽度 Width 设置图像高度 Height 设置图像边框 border 设置图像外边距 margin 设置图像图文混排 Float;left;right
- (1):块级元素:在页面中以区域块的形式呈现会独立占据一整行如:<h>标题元素<p>段落元素和元素。
- (2):行内元素:在页面中他可以和其他元素显示在一行中如:<a>超链接元素
- (3):所有块级元素若想左右排列则需添加float属性,所有行内元素则不需要。
- (4):选择符的类型:标记名选择符;Id选择符;Class(类)选择符
八:绝对单位值
属性值单位 描述 属性值单位 描述 px 像素 mm 毫米 pt 磅 cm 厘米 pc 皮卡 in 英寸 相对单位值: em ex %
九:超链接标记及属性
- (1) 超链接标记
<a href =”http:…………”>链接文本或图像</a> Target 属性指定链接页面的显示窗口(默认为serf当前窗口,还可以设置为blank 新窗口,parent 父框架,top 顶层框架)
- (2):对页面中所有超链接设置相同伪类样式。
a:link{ }单独指定尚未访问过的超链接的样式。 a:visited{ }单独指定以访问过的超链接的样式。 a:hover{ }单独指定鼠标指向超链接的样式。 a:active{ }单独指定单击激活的超链接的样式。
自动定位:position:static (3) 盒子的定位 相对定位:position:relation 绝对定位:position:absolute 固定定位:position:fixed
说明: (1):相对定位是相对于其本身定位进行偏移,绝对定位是相对于父盒子或浏览器进行偏移。 (2):相对定位时其他盒子给其留空,绝对定位时不留空。
元素的显示方式:display:显示方式 (1):inline 行内元素
(2):block 块级元素 (3):none 隐藏元素
元素的可见性:visibility:可见性 (1):visible 元素可见 (2):hidden 元素隐藏不可见 (3):inherit使用父元素的可见性
说明:当用display设置元素的隐藏时旧元素不给留空,当用vsibility 设置隐藏时留空。