保留空白
使用 HTML 实体,如
使用
<pre> 标签包起来
在父元素使用 CSS white-space:pre
html实体
显示结果描述实体名称实体编号
<小于号<<>大于号>>&和号&&“引号""
定制页面图标
<link rel=
"shortcut icon" href=
"favicon.ico" type=
"image/x-icon">
元数据 <meta>
<meta name=
"viewport" content=
"width=device-width, initial-scale=1.0">
<meta name=
"description" content=
"腾讯网(www.QQ.com)">
post vs get
表象不同,
get把提交的数据url可以看到,
post看不到
原理不同,
get 是拼接 url,
post 是放入
http 请求体中
提交数据量不同,
get最多提交
1k数据,浏览器的限制。
post理论上无限制,受服务器限制
get提交的数据在浏览器历史记录中,安全性不好
场景不同,
get 重在
"要",
post 重在
"给"
属性选择器 Attribute Selectors
[attr~=
val]
仅选择 attr 属性的值(以空格间隔出多个值)中有包含
val 值的所有元素,比如位于被空格分隔的多个类(
class)中的一个类。
[attr*=
val]
选择 attr 属性的值中包含字符串
val 的元素。
[attr^=
val]
选择 attr 属性的值以
val 开头(包括
val)的元素。
[attr$=
val]
选择 attr 属性的值以
val 结尾(包括
val)的元素。
[attr|=
val]
选择 attr 属性的值以
val(包括
val)或
val-开头的元素(-用来处理语言编码)。
单位 vw, vh 1vw = 1% 视口宽度, 1vh = 1% 视口高度 动态计算值例:calc(90% - 15px)
inline-block 之间空隙
Why? inline-block 之间有空格、Tab、换行符。 解决: 给父元素设置 font-size: 0,在 inline-block 元素上重新设置 font-size。
white-space: nowrap; (不换行)text-overflow: ellipsis;(多余的文本以省略号显示)
background-size cover 缩放背景图片以完全覆盖背景区,可能背景图片部分看不见。 contain 缩放背景图片以完全装入背景区,可能背景区部分空白。
background-clip (设置元素背景区域覆盖的范围) border-box 覆盖至边框的最外围 padding-box 覆盖至内边距的最外围 content-box 仅覆盖元素内容区域
弹性盒子
浮动 两个浮动元素,如果因放不下导致其中一个下移,对下移的元素设置负 margin 值大于自身的宽度可将其上移