H5 day02

样式表和图片

1.样式 创建样式规则

在head中插入 链接的颜色 访问过的颜色

嵌套标识符创建 ol ul {list-style-type:circle}  ul b {color:blue}

为应用样式创建类和标识  

hello world

 

哈哈哈

 

2.使用样式表改变文本格式

指定字体系列 和 尺寸大小 颜色 背景颜色 粗体和倾斜格式

 适用于这段文字

大小可以设置为em 为一倍 2em 也可以为xx-small x-small small medium large x-large xx-large  颜色 可以为RGB #FFFF00  粗体数值为100(最浅)-900(最深)

应用删除和下划线text-decoration 属性

文字下划线

简写的  List price:$24.00 Now 9.9$ 

创建内联跨度 测试内容 在style 写 .textContext {

color:red background-color:blue;font-family:Arial;}

调整字符间距 词语间距(word spacing) 和字符间距(letter spacing)默认为0 通常增加或缩减1像素已足够

This text has increased letter spacing

3.使用样式改变段落格式

段落缩进 首行缩进

内边距

外边距

margin-left 上下左右都可以

设定边框样式 border-style:solid 边框间空 padding:15px  边框宽度和颜色 border-width border-color  边框各边的格式化 border-top-color 设定边框四边 border:2px green solid 

段落的水平对齐 text-align :center ;right ;left ;justify(左右两端对齐) 设定行距line-height 

4.图像显示

插入图像 可以为路径 images/logo.gif 网址也可以  alt 表是图片的描述一般用户看不到 只有图片错误的时候显示 

图片的位置 left right  

图片的字符文本向下移动  先清空样式 应该在文本中写

向左移动

设置图片的大小 height width margin(外边距)  padding(内边距)

添加超文本链接

向图像中添加标题  

表示图标 来关联图像的标题 

关联一张图片