【CSS 小知识点集合】

  • 替换元素 和 非替换元素

替换元素就是平常 看到的 input img textarea select这些都是替换元素，之所以叫替换元素，他们都是没有实际内容的，都是根据标签和属性来判断渲染些什么东西。

非替换元素就是 div p 这些，浏览器根据内容直接显示出来。

  • 行内替换元素和行内非替换元素的区别

行内替换元素可以设置宽高和边距的，比如img。行内非替换元素设置不了盒模型属性 比如span

  • 关于viewport

每个手机都有自己的分辨率，有自己的物理长度（4.7寸 5.5寸) 对角线上的分辨率 / 物理长度 就是 像素密度dpi ；

我们一般都会设置，

<meta name="viewport" content="width=devich-witdth", initial-sclae=1.0">

这个就是让viewport 设置成屏幕宽度。

如果我们不设置，也会默认给我们一个虚拟视口，这个虚拟视口默认是980px， 如果手机分辨率大于980px， 就设置成手机的。那么在手机看起来，整个页面就是小小的。

　　

  • vw vh vmax vmin的区别。

vw 和 vh 就是屏幕实际大小的比例单位。 1 vw = 屏幕宽度 /100

vmax 就是 vw vh 比较大的一个。 手机 一般都是 vh 比较大

  • a:link 和 a 的区别。

a:link{color:blue;} 和 a{color:blue;} 这样看起来效果好像是一样的。

区别在于 a元素有没有 href 属性 ，如果 a 没有 href a:link是没有作用的 而a{color：blue}就是无区别对待

原文地址：https://www.cnblogs.com/tail33/p/8313229.html

时间： 2024-10-10 05:59:26

【CSS 小知识点集合】的相关文章

js,css小知识点记录

JS手册中提到:可以使用任意表达式作比较表达式.任何值为0.null.未定义或空字符串的表达式被解释为 false.其他任意值的表达式解释为 true.也就是说,这里会隐式的转换为布尔值. //css :#id .下属class(可以是直接或间接下属classs) #newfncbtnpanel .am-condition { margin-top: 10px; margin-left: 6px; margin-bottom: 5px; } show()\hide()  是jquery方法,即d

C#小知识点集合

1.修改字体颜色 //修改字体颜色 SolidColorBrush brushred = new SolidColorBrush();//创建对象 brushred.Color = Colors.Red;//调用方法 2.注册事件和消息传递 Messenger.Default.Register<string>(this, "IsChange", TextColor);//注册事件 后 Messenger.Default.Send<string>(name, &q

html+css小知识点

2014年9月9日22:52:37 p.uppercase {text-transform:uppercase;} p.lowercase {text-transform:lowercase;} p.capitalize {text-transform:capitalize;} //转大写,转小写,转首字母大写 p {text-indent:2em;} //首行缩进两个字符 h1 {letter-spacing:2px;} //制定字符之间的距离 p.small {line-height:70%

CSS小知识点一

1.   text-indent属性    缩进文本 通过使用 text-indent 属性,所有元素的第一行都可以缩进一个给定的长度,甚至该长度可以是负值.这个属性最常见的用途是将段落的首行缩进,一般来说,可以为所有块级元素应用 text-indent,但无法将该属性应用于行内元素,图像之类的替换元素上也无法应用 text-indent 属性.不过,如果一个块级元素(比如段落)的首行中有一个图像,它会随该行的其余文本移动. 注意:如果想把一个行内元素的第一行"缩进",可以用左内边距或

css小知识点

1,z-index 该属性设置一个定位元素沿 z 轴的位置,z 轴定义为垂直延伸到显示区的轴.如果为正数,则离用户更近,为负数则表示离用户更远. z-index 属性设置元素的堆叠顺序.拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面. 元素可拥有负的 z-index 属性值. Z-index 仅能在定位元素上奏效(例如 position:absolute/relative/fixed) 所有主流浏览器都支持 z-index 属性. 注释:任何的版本的 Internet Explorer

day-3 小知识点补充 编码 集合 文件及函数初识

1. 小知识点的补充 ==数值比较 is比较两边的内存地址 id获取内存地址 小数据池str int,公用一个内存,目的节省内存空间. 要求:A. int范围是-5到256,指向一个地址空间 B. str: 1.不能含有特殊字符 2.单个元素乘以数字不能超过21 2. 编码 字符:看到内容的最小单位.比如: abc:a一个字符 中国:中 Ascii码:1个字节,字母,数字,特殊字符 Unicode:也称万国码,最开始2个字节表示一个字符,后升级到4个字节表示一个字节 Utf-8:最后用8位表示一

私人定制javascript中数组小知识点(Only For Me)

先上笑话,1.刚看到一个游泳的,想起公司组织去三亚旅游,老板跳海里,各种挣扎,捞上来老板第一句话:我记得我会游泳的啊. 2.媳妇说:老公对不起,我把你新买的自行车撞散架了! 老公:没事宝贝,你若安好,便是晴天! 媳妇说:老公你太有诗意了. 老公:滚犊子,安不好我整死你! 数组的概念 javascript数组是值得有序集合,不过它实属一个javascript对象的特殊形式,这是一个很重点的定性. 创建数组 1.var a=new Array();//等同于[] 2.var a=new Array(

HTML和CSS的知识点

HTML的知识点 HTML的结构: <!DOCTYPE html>: 文档类型性为HTML5文件 文档声明:在HTML的文档中必不可少,且必须在文档的第一行 文档声明的编码格式<!----> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> </body>. HTML的三个常见头部标

纯CSS小三角制作

无关的知识点 ① background-clip 属性规定背景的绘制区域. 1.padding-box:从padding区域(不含padding)开始向外裁剪背景. 2.border-box:从border区域(不含border)开始向外裁剪背景. 3.content-box:从content区域开始向外裁剪背景. 4.text:从前景内容的形状(比如文字)作为裁剪区域向外裁剪,如此即可实现使用背景作为填充色之类的遮罩效果. ② clip auto:对象无剪切rect(<number>|aut