HTML标签标签自定义列表(描述列表)名词1(描述词)名词1解释1(描述描述)名词1解释2名词2名词2解释1名词2解释2HTML5新特性(ie8及以下浏览器不支持)语义标签增强形式视频音频Canvas绘图SVG绘图Geolocation拖拽APIWebWorkerWebStorageWebSocket锚点跳转当前页面a.html:跳转到b页aaa另一页b.html:aaaCSS选择器类型是相邻的Selector(h1+p),child选择器(ul>li),后代选择器(lia)选择器优先级!important>inline>id选择器(#id{})>类类选择器(.class{})=属性选择器(a[href="xxx"]{})=伪类选择器(:xxx{})>伪元素选择器(::before{})=标签选择器(span{})>通配符选择器(*{})>继承父元素>浏览器默认样式inheritance可继承样式:font-sizefont-familycolor,ULLIDLDDDT;不可继承的样式:widthheight、marginborderpadding;用省略号图替换多余的文字内容TD设置宽度 width-->设置文字不换行 white-space:nowrap-->隐藏溢出内容 overflow:hidden-->省略溢出内容 text-overflow:ellipsisCSS3新特性颜色:添加RGBA、HSLA文本-阴影边框圆角border-radius、边框阴影框-阴影框模型box-sizing背景背景-size设置背景图片大小background-origin设置背景图片原点background-clip设置背景图片裁剪区域,以“,”分隔可以设置多个背景自适应布局gradient:linear-gradient,radial-Gradienttransition:transition可以实现动画自定义动画CSS3中唯一引入的伪元素是::selection多媒体查询,多列布局border-image2D,3D转换display:none,visibility:hiddenandopacity:0display:none;可见性:隐藏;不透明度:0;存在×√是否重绘√×是否重排√×是否还原原子元素×√×是否支持过渡×√是否触发自绑定事件×√是否影响隐藏元素触发事件×√LayoutUsingeven-网页中的编号字体偶数数字相对容易与网页设计的其他方面一起使用他部分地构成比例关系。Windows自带的点阵宋体(ZhongyiSongtypeface)从Vista开始只提供12、14、16px的点阵尺寸,而13、15、17px则使用较小的尺寸。观点。(也就是每个词占用的空间增加了1px,但是点阵没有变化)所以略显稀疏。三列布局绝对定位。事后添加新标签(不推荐)缺点:添加无意义的标签,语义不清晰:两者兼而有之;hideparentelementoverflowcontent(不推荐)缺点:当内容增多时,容易导致内容被隐藏,没有自动换行。无法显示要溢出的元素overflow:hidden/auto;//父元素*zoom:1;//IE6需要触发HasLayout,只有IE6-IE7执行using:after伪元素清除浮动(推荐)。父元素:after{content:"";显示:块;明确:两者;}。父元素{*zoom:1;}前后使用双伪元素(最推荐)。父元素:before,.父元素:after{content:"";显示:表格;}。父元素:在{clear:both;}之后。父元素{*zoom:1;}水平和垂直居中块级元素margin:0auto;行内元素text-align:center;单行-高度=高度;多行显示:table-cell;vertical-align:middle;使用flex布局display:flex;justify-content:center;align-items:center;使用绝对定位position:absolute;(1)left:50%;top:50%;transform:translateX(-50%);transform:translateY(-50%);(2)margin:auto;top:0;右:0;底部:0;left:0;(概念不是很清楚的,菜鸟也可以去查一下~)
HTML+CSS(知识点总结)相关文章