html&&html5(1)

html 文件格式 , 编辑器:editplus , notepadd++ , sublime , phpstrom ,webstrom

修改文件名后缀:组织->文件夹和搜索->查看->隐藏已知类型的扩展名

浏览器:用firefox和chrome

doctype  解析标准   description和keywords,用来说明自己页面的关键词,来吸引蜘蛛.seo

以下为头文件 :
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="zh-CN" />
<meta content="all" name="robots" />
<meta name="author" content=" 。。。 " />
<meta name="Copyright" content="www.itbool.com,版权所有,不得随意转载" />
<meta name="description" content="  内容 1 2 3 4  " />
<meta  name="keywords" content="php  " />
<link rel="icon" href="/favicon.ico" type="image/x-icon" />
<link rel="shortcut icon" href="http://www。xxx.com/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" rev="stylesheet" href="images/li.css" type="text/css" media="all" />


★div+css盒模型布局

div 布局css 控制 , 无语义标签 

h5中是有语义标签

浮动float  和 clear

字符集:<meta charset="UTF-8">  用记事本保存的编码和head里面声明的字符集不一致

margin  水平居中 margin:0px auto; maring:auto auto ;

border   css3手册 -> 边框

padding   默认是往外挤的, h5中 两种不同的盒子模型


css3新增属性

background-clip 指定对象的背景图像向外裁剪的区域 border-box(默认) (虚边实验)

背景被裁剪到边框盒 padding-box 背景被裁剪到内边距框 content-box 背景被裁剪到内容


css3新属性 新属性 box-sizing 设置或检索对象的盒模型组成模式。

content-box (内容盒)默认值w3c的盒子:盒子的尺寸,宽高是写内容的地方

border-box (边框盒):盒子的尺寸,宽高是包含边框在内的,那写内容的地方变小,响应式布局上,就需要用 边框盒。 是向内挤的;


标签元素 内联和块状 ;有语义和无语义 ;

display:none; block ; inline ;

css 控制元素样式 ; 段落文本 , 字体衬线 , 图片 , 绝对和相对定位 ,  字符实体

选择器 :  id 、类  、 标签 、 层级 ; a标签  伪类选择器 lvha


css引入

<link rel="stylesheet" href="./28.css">

@import导入CSS文件一定要放在第一行

内联: <div style="width:200px;height:200px;background:red;"></div>

HTML标签的STYLE标签里


css初始化

taobao.com 的css初始化代码 index-min.cs

雅虎.. sina .. tencent..


html5 新标签  

<a href="http://www.baidu.com"> biaoqian </a>

target属性  target="_blank"


锚点  地址栏 : 38.html#q3

<h2 id="q3">住宿情况</h2>  html5用id当锚点

<a name="q3"> <h2>住宿情况</h2> 老式












你可能感兴趣的:(html&&html5(1))