CSS3与页面布局学习总结系之二 —— Box Model、边距折叠、内联与块标签、CSSReset
此系列文章为转载文章,原出完整系列已经不从考证。从不同地方摘录到此,以备阅读方便,特此记录。
盒子模型(Box Model)
盒子模型也有人称为框模型,HTML中的多数元素都会在浏览器中生成一个矩形的区域,每个区域包含四个组成部分,从外向内依次是:外边距(Margin)、边框(Border)、内边距(Padding)和内容(Content),其实盒子模型有两种,分别是 ie 盒子模型和标准 w3c 盒子模型,加上了doctype声明,让所有浏览器都会采用标准 w3c 盒子模型去解释你的盒子。
当设置一个元素的样式如下示例:
1234567891011121314151617181920 ...
CSS3与页面布局学习总结系之一 —— 概要、选择器、特殊性与刻度单位
此系列文章为转载文章,原出完整系列已经不从考证。从不同地方摘录到此,以备阅读方便,特此记录。
web前端开发者最最注的内容是三个:HTML、CSS与JavaScript,他们分别在不同方面发挥自己的作用,HTML实现页面结构,CSS完成页面的表现与风格,JavaScript实现一些客户端的功能与业务。当然内容与用户资源也是不能忽视的。尽量不要跨职责范围使用,有点“SRP单一职责”的意思,如字体大小应该是CSS控制的,就不应该使用HTML标签完成,如果CSS能解决的问题尽量不要用JavaScript完成。
CSS3 概要
CSS(Cascading Style Sheet)是层叠样式表的 ...
前端参考 -- CSS 时间轴多例
纵向时间轴
纵向时间轴
下载地址
演示和代码
效果图
纵向时间轴
下载地址
演示和代码
效果图
纵向时间轴
下载地址
演示和代码
效果图
纵向时间轴
下载地址
演示和代码
效果图
纵向时间轴
下载地址
演示和代码
效果图
纵向时间轴
下载地址
演示和代码
效果图
纵向时间轴
下载地址
演示和代码
效果图
纵向时间轴
下载地址
演示和代码
效果图
纵向时间轴
下载地址
演示和代码
效果图
纵向时间轴
下载地址
演示和代码
效果图
纵向时间轴
下载地址
演示和代码
效果图
纵向时间轴
...
前端参考--项目实践
前端代码的结构组织和文件的命名
前端代码的结构组织
123456789101112131415www │ | index.html | 文件 | 项目入口 | | +---css | 目录 | 放置 CSS 样式的代码 | | custom.css | 文件 | 业务相关样式文件 | | rest.css | 文件 | ...
前端参考 -- HTML标签之块级标签、行内标签、行内块标签
块级元素
独占一行,对宽高的属性值生效;如果不给宽度,块级元素就默认为浏览器的宽度,即就是100%宽;
块级元素包含:p、div、ul、ol、li、dl、dt、dd、h1~h6、form;
特点:独占一行,对高度、宽度、行高以及顶和底边距都可设置的属性值生效;如果不给宽度,块级元素就默认为浏览器的宽度,即就是100%宽;
p标签:段落标签,段落文字使用,默认格式:段尾进行换行;
div标签:划分块的主要使用标签;
ul标签:无序列表的主标签,后面的标号为圆点(黑色);
ol标签:有序列表的主标签,后面一般跟有序的1,2,3,4,5…;
li标签:列表中的主体使用标签
dl标签:自定义 ...
前端参考 -- CSS 选择器
每一条css样式定义由两部分组成,形式如下:选择器{样式} 在{}之前的部分就是“选择器”。 “选择器”指明了{}中的“样式”的作用对象,也就是“样式”作用于网页中的哪些元素。
基础选择器
通用元素选择器 *: 所有的标签都变色
标签选择器:匹配所有使用p标签的样式 p{color:red}
id选择器:匹配指定的标签 #p2{color:red}
class类选择器:谁指定class谁的变色,可选多个 .c1{color:red} 或者 div.c1{color:red}
123456789101112131415161718192021 ...
前端参考 -- HTML 引入JS、CSS 方式
HTML引入CSS样式
HTML引入CSS样式的方式
HTML 引入 css 样式有四种方式:分别为内联定义、链入内部CSS和链入外部CSS。有一点注意,样式表放在不同的地方,产生作用的范围不同。
内联定义
内联定义,即在对象的标记内使用对象的style属性定义适用的样式表属性,格式定义为 :,如下示例:
123456789101112<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>内联定义</ ...
前端参考-- HTML颜色名
所有现代浏览器均支持以下 144 种颜色名称(单击颜色名称或十六进制值可将颜色查看为背景颜色与不同的文本颜色的搭配):
颜色名
十六进制颜色值
颜色
AliceBlue
#F0F8FF
AntiqueWhite
#FAEBD7
Aqua
#00FFFF
Aquamarine
#7FFFD4
Azure
#F0FFFF
Beige
#F5F5DC
Bisque
#FFE4C4
Black
#000000
BlanchedAlmond
#FFEBCD
Blue
#0000FF
BlueViolet
#8A2BE2
Br ...
除了比特币,还该知道电子货币
比特币不是互联网上唯一的数字货币,还有瑞波币(Ripple),恒星币(Stellar),莱特币(Litecoin),以太币(ETH),等等其他数字货币。当然,目前最流行的依然是比特币。
比特币(BitCoin)
2009年诞生,2013年10月后,因价格暴涨在全世界引起关注,2008年11月1日,一个自称中本聪(Satoshi Nakamoto)的人在一个隐秘的密码学评论组上贴出了一篇研讨陈述,陈述了他对电子货币的新设想——比特币就此面世,比特币的首笔交易完成。
狗币
狗币也叫狗狗币,诞生于2013年12月8日,是由一位澳大利亚的品牌与市场营销专家和一位美国俄勒 ...
什么是电子货币、 虚拟货币、 数字货币
微信、支付宝平台转账使用的电子货币,我国发行在即的央行数字货DCEP,Facebook或2020年推出的加密数字货币Libra,以及基于区块链等技术,市场投资风险大的比特币、以太币,还有曾在腾讯平台上充过的QQ币,以及王者荣耀里面的游戏金币,这些“币”都是什么币?如何归类?怎么区分?看这里!
电子货币
电子货币即通过电子化方式支付的货币,即用一定金额的现金或存款,从发行者处兑换并获得代表相同金额的数据,或者通过银行及第三方推出的快捷支付服务,通过使用某些电子化途径将银行中的余额转移,从而能够进行交易。电子货币本质上是法定货币的电子化和网络化,按照发行主体和应用场景分为储值卡、银行卡 ...