h5笔记2
•离线缓存:
html配置manifest属性,cache.manifest是缓存配置文件
<html lang="zh-CN" manifest="cache.manifest">
建立cache.manifest,写下如下内容
CACHE MANIFEST
#修改时间 2017-03-06 11:25
CACHE:
test2.css
表示test2.css将缓存在本地,下次即使test2.css文件更新,浏览器也先从本地获取,如果要重新获取,需要更改注释中的时间或版本号比上次更新的时间往前
CACHE MANIFEST下面的注释可以是时间,也可以是版本号,浏览器会比较本地的这个服务器和本地这个文件,看是否有更改,来确定是否要重新从服务器获取(此文件任何更改都会导致从服务器从新下载所有文件)
-----此项设置需要服务器配置支持
•emmet父子连写:nav>ul>li*3 会自动填充:
<nav>
<ul>
<li></li>
<li></li>
<li></li>
</ul>
</nav>
•header,article,nav,main标签的作用:
语义化标签。
原来写一个页面。
比如有头部。和底部。我们都是定义一个div
只不过头部有一个class=header 尾部的div是class=footer
现在html5出现以后。主张语义化标签。
现在我们写样式的时候。选择器直接就写header就可以了。
不需要这么写 div.header
这样的好处是使得文档结构层次清晰。利于代码编写和开发。
还有搜索引擎优化等等的好处
实际上相当于有语义的div,简化的div,很多属性没有
实际效果就是div
•大多数 HTML 元素被定义为块级元素或内联元素。
块级元素在浏览器显示时,通常会以新行来开始(和结束)。
实例: <h1>, <p>, <ul>, <table>
内联元素在显示时通常不会以新行开始。
实例: <b>, <td>, <a>, <img>
<div> 元素是块级元素,它是可用于组合其他 HTML 元素的容器。
<div> 元素没有特定的含义。除此之外,由于它属于块级元素,浏览器会在其前后显示折行
<span> 元素是内联元素,可用作文本的容器
<span> 元素也没有特定的含义。
•id一个页面必须唯一,class不需要唯一
•margin属性可以指定4个值,分别为上、右、下、左
如果只提供一个,将用于全部的四边。
如果提供两个,第一个用于上、下,第二个用于左、右。
如果提供三个,第一个用于上,第二个用于左、右,第三个用于下
值可以设置为auto:
margin-top/margin-bottom计算值为0,margin-left/margin-right取决于可用空间。
div {
margin: 100px 100px 0px 0px;
}
注意这种多属性值得设置,中间都是没有逗号的
•让元素自己居中显示的方法:
margin: 5px auto;
第一个值为垂直方向上下的留白,根据需要设置,如果设置为auto,则为0,第二个值为水平方向的留白,设置为auto会自动根据可用的空白空间平分给左右使用
•<label> 标签为 input select等控件元素定义标注(标记)。
label 元素不会向用户呈现任何特殊效果。不过,它为鼠标用户改进了可用性。如果您在 label 元素内点击文本,就会触发此控件。就是说,当用户选择该标签时,浏览器就会自动将焦点转到和标签相关的表单控件上。
<label> 标签的 for 属性应当与相关元素的 id 属性相同。
如果是单个控件的标签,可以这样写:
<label>姓名:
<input type="text" name="username" placeholder="姓名">
</label>
如果是组合控件,可以这样写:
<label for="sex">
性别:
</label>
<input type="radio" name="sex" value="male" checked>男
<input type="radio" name="sex" value="female">女
●定义宽高时,必须写单位,如果不写,大部分浏览器会任务忽略此项对宽高的声明
•同一个属性的属性值,用逗号分隔,表示同一个属性的多个可能的取值,它是顺序取的,前一个不成立则选择后一个,它们描述的是同一个属性
font-family:"Times New Roman",Georgia,Serif;
一个属性有多个设定值,则只要用空格,不要逗号:
background: url("amazing-sky.jpg") center center;
h5笔记2的更多相关文章
- h5笔记02
Markdown 用普通文本描述富文本的语法 扩展名md,markdown 链接:http://wowubuntu.com/markdown/ 代表h标签 没有符号的代表段落 -符号代表无序列表 1. ...
- H5笔记周记
9.4 一.介绍浏览器 1.title 主题,题目 2.url 网址 3.body 网站的内容 4.html 语言,超文本标记语言 二.文件介绍 三.标签的结构 (一些快捷键:Ctrl+s 保存 ...
- h5笔记
标签 更语义化标签 header标签 nav标签 section标签 article标签 aside标签 widget标签 footer标签 为什么要有语义化标签 能够便于开发者阅读和写出更优雅的代码 ...
- H5笔记——locaStorage和sessionStorage本地存储的一些坑
当使用window.localStorage或者window.sessionStorage 存储json数据时需要将json数据用JSON.stringify(data)转换成json字符串再存储在本 ...
- h5笔记(实战)
1.margin:auto 水平居中只对block有效,对inline和inline-block都无效 2.text-align:center 内容居中对block和inline-block有效,对i ...
- h5笔记1
1.HTML中不支持 空格.回车.制表符,它们都会被解析成一个空白字符 2.适用于大多数 HTML 元素的属性: class 为html元素定义一个或多个类名(classname)(类名从样式文件引入 ...
- H5学习笔记1
H5学习笔记 1.创建超链接: target=”_blank”:链接的目标网页会在新的窗口中打开. target=”_parent”:链接的目标会在当前窗口中打开,如果在框架网页中,则会在上一层框架打 ...
- Swoole实现h5版聊天室笔记
声明:该聊天室目前只有一对多,一对一的聊天功能,另外,因为没有使用到mysql,所以还存在比较多的缺陷地方,但知道原理就差不多了,这里主要分享下swoole简易的聊天室制作思路. 开发环境:cento ...
- iOS原生App与H5页面交互笔记
文/MikeZhangpy(简书作者)原文链接:http://www.jianshu.com/p/4ed3e5ed99c6著作权归作者所有,转载请联系作者获得授权,并标注“简书作者”. 最近在做一个项 ...
随机推荐
- 测试工具Fiddler(三)—— 常见功能介绍
Fiddler的功能面板 1.statistics:请求的性能指标:全世界范围的性能测试: RTP:一个请求的从发送出去到返回的时间: Show chart可以看出图表的示例: 2.inspector ...
- js css html加载顺序
1.js放在head中会立即执行,阻塞后续的资源下载与执行.因为js有可能会修改dom,如果不阻塞后续的资源下载,dom的操作顺序不可控.正常的网页加载流程是这样的.浏览器一边下载HTML网页,一边开 ...
- Activiti定时任务
Activiti定时任务 作者:Jesai 傻逼一样的去坚持,就会有牛逼的结果 情景: 某公司有一个OA系统,审批环节是经理.有一天,经理出差了,然后下面突然有一份决定公司某个重大项目是否能顺利中标的 ...
- 安装numpy、matplotlib
一.安装numpy 1.下载 https://pypi.org/project/numpy/#files 2.安装 pip3 install numpy-1.17.3-cp37-cp37m-win_a ...
- python 判断文件的字符编码
import chardet f = open(file='test1.txt', mode='rb') data = f.read() print(chardet.detect(data))
- Java单体应用 - Markdown - 01.简介
原文地址:http://www.work100.net/training/monolithic-markdown.html 更多教程:光束云 - 免费课程 简介 序号 文内章节 视频 1 概述 2 特 ...
- [bzoj3527] [洛谷P3338] [Zjoi2014]力
Description 给出n个数qi,给出Fj的定义如下: \[ F_j=\sum\limits_{i<j} \frac{q_iq_j}{(i-j)^2} - \sum\limits_{i&g ...
- 1、python3.x安装(windows)
现在大部分自动化测试已经使用python3.x版本,与Python2的区别这里就不多说了,如有兴趣可以自行百度. 一.下载 官网:https://www.python.org/downloads/,下 ...
- Docker windows nanoserver/mysql镜像root用户密码错误
由于需要在Windows server上的Docker中部署mysql服务,为了方便起见所以在Docker hub找到了nanoserver/mysql (https://hub.docker.com ...
- PTA 6-15 用单向循环链表实现猴子选大王 (20 分)
一群猴子要选新猴王.新猴王的选择方法是:让n只候选猴子围成一圈,从某位置起顺序编号为1~n号.每只猴子预先设定一个数(或称定数),用最后一只猴子的定数d,从第一只猴子开始报数,报到d的猴子即退出圈子: ...