HTML5|CSS3 第2页

基础知识HTML5、CSS3以及在PC和H5页面的适配和兼容

css基线与行高关系

18

前端学堂 发布于 2018-04-09

一、基本概念 1、基线、底线、顶线、中线 注意:基线(base line)并不是汉字文字的下端沿,而是英文字母“x”的下端沿。 2、内容区 内容区[...]

阅读(662)赞 (1)

基于rem方案实现自适应布局

6

前端学堂 发布于 2018-04-02

rem是相对于根元素<html>,这样就意味着,我们只需要在根元素确定一个px字号,则可以来算出元素的宽高。本文讲的是如何使用rem实现自适应。rem这是个[...]

阅读(634)赞 (0)

每日一击:z-index与translateZ

1

前端学堂 发布于 2018-01-03

我们在写样式的时候,经常会用到 transform: translate3d(0px, 0px, 0px),据说这个还能开启浏览器动画硬件加速。但是你知道吗,这里面包含了一个坑,那就[...]

阅读(747)赞 (0)

H5页面秒开-套路1

前端学堂 发布于 2017-12-12

随着移动设备性能不断增强,web 页面的性能体验逐渐变得可以接受,又因为 web 开发模式的诸多好处(跨平台,动态更新,减体积,无限扩展),APP 客户端里出现[...]

阅读(680)赞 (2)

CSS 变量(CSS Variable)

1

前端学堂 发布于 2017-10-16

这是一个令人激动的革新。 CSS 变量,顾名思义,也就是由网页的作者或用户定义的实体,用来指定文档中的特定变量。 更准确的说法,应该称之为 CSS 自[...]

阅读(762)赞 (1)

伪类与伪元素的用法

4

前端学堂 发布于 2017-10-16

熟悉前端的人都会听过css的伪类与伪元素,然而大多数的人都会将这两者混淆。本文从解析伪类与伪元素的含义出发,区分这两者的区别,并且列出大部分伪类与伪[...]

阅读(757)赞 (1)

H5兼容性问题总结

3

前端学堂 发布于 2017-09-06

文字问题 1.文字顶部被截掉,这个很坑,常见于android手机     机型:android手机,红米note4x, 小米6 原因: 文字大小和行高一样的时候,[...]

阅读(1048)赞 (3)

学习和使用flexbox布局

4

前端学堂 发布于 2017-09-04

是时候好好学习flex布局了,之前的开发经验主要集中在web pc端开发,现在主要集中在H5页面的开发,既然H5基本都支持flex布局,为什么不熟练使用呢?这里借[...]

阅读(690)赞 (1)

SVG的视窗与宽高比控制

14

前端学堂 发布于 2017-08-29

SVG元素不像HTML元素一样由CSS盒模型管理。这使得我们可以更加灵活定位和变换这些元素-也许一眼看上去不太直观。然而,一旦你理解了SVG坐标系和变换,操纵SVG会非常简单并且很有意义。本篇文章中我们将讨论控制SVG坐标系的最重要的三个属性:viewport, viewBox,...

阅读(1349)赞 (1)

SVG的牛B之处,你造吗

2

前端学堂 发布于 2017-08-29

SVG能干啥,想干啥就干啥。可以用来做贴图,做纹理,做动画,甚至做背景图片,你想要的都可以,关键是操作灵活,和别是和canvas又可以相互转化使用,简直是居家旅行必备神器,作为前端工程师,你学会了吗?不会,就抓紧开始吧。

阅读(832)赞 (2)

浏览器兼容性经验笔记

1

前端学堂 发布于 2017-08-29

遇到好多坑,一路走来,发现竟是坑。调IE7,泪流满面;调微信浏览器,汗流浃背,沐浴泪光。哎,记录一下,有些坑人的地方,还是比较有趣的,值得注意。

阅读(779)赞 (1)

SCSS/SASS编译

1

前端学堂 发布于 2017-08-29

SASS是CSS3的一个扩展,增加了规则嵌套、变量、混合、选择器继承等等。通过使用命令行的工具或WEB框架插件把它转换成标准的、格式良好的CSS代码。SCSS即是SASS的新语法,是Sassy CSS的简写,是CSS3语法的超集,也就是说所有有效的CSS3样式也同样适合于SASS...

阅读(790)赞 (0)