Div+CSS网页设计(HTML5)

来源:互联网 发布:魔兽世界7.3优化设置 编辑:程序博客网 时间:2024/05/19 03:22

1、将图片添加到div中间位置

<div style="color:#0000FF" id="top">

  <div class="f1" align="center"><img src="img/logo.png">         </div>

</div>


#top{background: cadetblue;height: 170px;}


2、控制DIV里的文字的位置

.f2{
  font-family: "微软雅黑" ;
  color:#FFFFFF;
  margin-top:-100px; //离顶部位置
  margin-left: 1200px; //离左边边界位置
}


PS:

css控制字体的方法:

  1. 设置字号:font-size:12px

  2. 设置字色:color:#0000

  3. 设置字体:font-family:"黑体"

  4. 设置行高:line-height:150% line-height:1.5em

  5. 设置字体的粗细:font-weight:normal[正常]bold[粗体]

  6. 设置字体样式:font-style:normal[正常]italic[斜体]

  7. 修饰文字:text-decoration:none[正常]underline[下划线]overline[上划线]line-through[删除线]

  8. 字符间距:letter-spacing:normal[默认]length[长度单位]

  9. 单词间距:word-spacing:normal[默认]length[长度单位]

  10. 设置对象中文本缩进:text-indent:length text-indent:2em

  11. 文本水平对齐方式: text-align:left[左]center[中]right[右]

  12. 对象中空白处理: white-space:normal[自动换行]pre[换行和空白受保护nowrap[强制在同一行显示]

  13. 文本大小写控制: text-transform:none[正常大小]

                               capitalize[每个单词的第一个字母转换成大写]

                               uppercase[转换成大写]

                               lowercase[转换成小写]