随笔分类 -  HTML5/CSS3

如何实现内滚动布局
摘要：既然是内滚动，就有必要干掉浏览器原生<html>的滚动条，这个很简单： 对于固定的头部header或者固定的侧边side, 你可以使用语义明确的position:fixed定位，或者直接使用position:absolute，因为滚动容器跟他们平级，所以，absolute其实就是fixed效果。 讲 阅读全文
posted @ 2017-01-03 15:37 mumakiss
CSS 禅意花园
摘要：http://www.csszengarden.com 阅读全文
posted @ 2017-01-02 23:41 mumakiss
1HTML5音频audio元素
摘要：一、音频文件格式.ogg/.mp3/.wav/.aac/.mp4/.opus，最后一种新的音频文件格式，在本书写作之时只有 Firefox 支持。对于音频，最好的两种格式是 Ogg 和 MP3。二、在网页中添加带控件的单个音频文件<audio src="my-audio.ext" autoplay 阅读全文
posted @ 2016-12-25 00:57 mumakiss
HTML5视频Video元素
摘要：一、视频文件格式 HTML5 支持三种视频文件格式（即编解码器）。‰1、Ogg Theora 使用的文件扩展名为 .ogg或 .ogv，支持它的浏览器包括 Firefox3.5+、 Chrome 4+、 Opera 10.5+ 以 及Android 版 Firefox。‰2、MP4（H.264）使用 阅读全文
posted @ 2016-12-24 23:58 mumakiss
对默认的样式进行重置或标准化
摘要：对默认的样式进行重置或标准化整体上，不同浏览器提供的默认样式表是相似的，但也存在一定的差异。因此，在使用css之前，常要抹平差异。 1）使用CSS重置（reset）开始主样式表文件。reset.css(author：Eric Meyer) 2)使用Nicolas Gallagher和Jonathan 阅读全文
posted @ 2016-12-21 10:39 mumakiss
在旧浏览器中为HTML5元素添加样式
摘要：在旧浏览器中为HTML5元素添加样式针对全部浏览器为HTML5新元素添加样式1）将以下代码添加到网站的主样式表文件（即所有页面都用到的样式表文件）。注意：如果使用CSS重置或normalize.css可以跳过这一步，它们会包含这里的代码。article,aside,figcaption,figure 阅读全文
posted @ 2016-12-21 10:26 mumakiss
文本样式表
摘要：font简记法：必须先是字体大小，再是字体系列；行高为可选，但必须紧跟字体大小和斜杠后面。line-height： //设置行高font-family：Geneva，Tahoma，sans-serif；//指定替代字体，可以列举一种以上的字体。字体列表称为字体栈。通常至少包含三个字体：我们希望的字体 阅读全文
posted @ 2016-12-21 09:39 mumakiss
关于CSS选择器的笔记（一）
摘要：CSS选择器1、按上下文选择元素祖先是包含目标元素（后代）的任何元素，不管它们之间隔了多少代。父元素是直接包含另一个元素的元素，它们之间只隔一代，被包含的元素称为子元素。同胞元素是拥有同一个父元素的任何类型的子元素。相邻同胞元素是直接相互毗邻的元素，即它们之间没有其他的同胞元素。 article.a 阅读全文
posted @ 2016-12-20 12:08 mumakiss
HTML标签笔记一
摘要：一、段落和行1、段落（p元素）表示一个段落，但不能包含一个“块级元素”（包含<p>自身），可以省略结束标签，然后开始第二个封闭级额开始标签。2、控制换行（br和wbr元素）强制换行br元素，软换行wbr，禁止换行使用实体“&nbsp;”可以被用作浏览器不会换行的空格符。3、连字符：包括简单连字符“- 阅读全文
posted @ 2016-12-19 13:27 mumakiss
Meta元素标签的viewport属性应用
摘要：移动设备 viewport：能优化移动浏览器的显示。如果不是响应式网站，不要使用initial-scale或者禁用缩放。 大部分4.7-5寸设备的viewport宽设为360px；5.5寸设备设为400px；iphone6设为375px；ipone6 plus设为414px。 WebApp全屏模式： 阅读全文
posted @ 2016-12-19 11:22 mumakiss
HTML 5: 根元素, 标题，元数据元素, 脚本元素
摘要：HTML 5: 根元素, 元数据元素, 脚本元素 根元素 - doctype, html 元数据元素 - head, title, base, link, meta, style 脚本元素 - script, noscript 1、<!doctype html>，文档类型 2、<html lang= 阅读全文
posted @ 2016-12-19 09:37 mumakiss
HTML元数据<meta>标签
摘要：什么是元数据？为何需要元数据？ 要理解这个问题，首先要知道“元”是什么。元(meta)，一般被我们翻译成“关于……的……”。 元数据(meta data)——“data about data” 关于数据的数据，一般是结构化数据（如存储在数据库里的数据，规定了字段的长度、类型等）。元数据是指从信息资源 阅读全文
posted @ 2016-12-19 09:17 mumakiss
设置div的背景为半透明的方法（转）
摘要：代码如下: div{filter:alpha(Opacity=80);-moz-opacity:0.5;opacity: 0.5;} 说明： 1、filter：对win IE设置半透明滤镜效果，filter:alpha(Opacity=80)代表该对象80%半透明，火狐浏览器不认 2、-moz-op 阅读全文
posted @ 2016-12-12 10:09 mumakiss
导航条的制作——水平伸缩
摘要：1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www. 阅读全文
posted @ 2016-11-29 16:52 mumakiss