module3_02_静态页面项目初始化

静态页面项目初始化

一、head内部配置

1.1 <title>网页标题

1.2 标签页icon图标

  • 使用<link>方式进行引用

  • <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">

1.3 css分级引入

  • 常见分层组织:清除默认样式的css,网站的公共样式css,每个页面自己独有的css

(1)清除默认样式

  • reset.css(雅虎UI___不建议更改)

(2)公共样式

  • 使用范围: 单独的一个网站所有的页面、几个页面

  • common.css或模块名.css/base.css

(3)页面独有样式

  • 使用范围:单独的一个HTML页面

  • index.css

  • 注意:使用单独样式文件去层叠前面公共样式时,需要注意选择器权重

二、header区域

  • 网页顶部的命名

  • 布局类型:通栏背景,内部包含版心居中的主要内容,内容包含左、右浮动的两部分

  • 整体结构:100%div>版心的div

  • 注意:为了避免更改公共的版心样式,<div>需要添加一个class属性值

  • logo:使用h1>a结构,可以适当添加SEO搜索的关键字

原文地址:https://www.cnblogs.com/lezaizhu/p/13960066.html