donghe_z-优快云博客

原创 CSS3_新的UI方案（文本新增样式、盒模型新增样式、新增UI样式）

文本新增样式 1.opacity 通过改变opacity的值可以改变背景透明度 background-color: yellow; opacity: 0.3; 它连同整个元素里面的其他元素一起变透明 2.rgba background-color:rgba(0,0,0,0.3); 它是只改变某一指定背景的透明度 3.文字阴影text-shadow 属性：color 左右偏移量上下偏移量模糊程度浮雕文字做法：设置文字基本样式（字体大小，颜色，行高等）设置文字的text-shadow属

2020-05-10 21:02:11 323

原创 CSS3_css选择器（详细汇总）

基本选择器及其扩展 1.子元素选择器 #wrap > #first（选中#wrap的儿子元素first，不选择其他隔代后代元素） 2.相邻兄弟元素（只会匹配紧跟的下面的兄弟元素） #wrap > #first +.inner 必须是紧跟着的下面的类名为inner的元素,中间不能有别的元素 eg: <div id="wrap"></div> <div...

2020-05-02 15:07:38 374

原创 HTML&CSS2.1中字体文本的基础属性及如何让img垂直水平居中

字体属性 1.font-size 浏览器状态下默认字体大小为16px，最小为12px （当字体大小为负值时，浏览器显示大小为16；当字体大小为正值但小于12时，浏览器大小为12；当字体大小为0，浏览器显示为没有字） font-size：2em（浏览器实际显示大小为32px） 2.font-style font-style:oblique或italic（字体倾斜） 3.font-weight...

2020-05-02 11:43:00 315

原创 HTML&CSS2.1中BFC的基础知识汇总

Box Formatting Context Box：css布局的对象和基本单位 Formatting Context（决定盒子如何渲染的文档）：元素的类型和display属性会决定Box的类型。不同类型的Box，会参与不同的Formatting Context ps：Box内的元素会以不同方式渲染： 1.block-level box（块元素）:display属性为block，list-ite...

2020-05-02 11:41:30 218

原创 HTML&CSS2.1盒子元素垂直水平居中

如何让子元素在父元素中垂直水平居中 1.已知子元素的高度和宽度设置子元素为绝对定位，left为50%，top为50% 为父元素开启定位，是父元素为子元素的包含块，开启后子元素的left和top就参照于父元素的width和height（否则子元素的left和top就参照于包含块HTML的width和height移动） margin-top为-50px，margin-left为-50px ...

2020-05-02 11:33:03 272

原创 HTML&CSS2.1清除浮动

清除浮动（让浮动的子元素撑开父元素） 1.对父元素加高度height 扩展性不好 2.开启父元素的bfc区域： float不为none overflow不为visible position为absolute或fixed display为inline-block，flex，table-cell，table-caption，inline-flex 3.设置HTML属性，添加一个br标签： <...

2020-05-02 11:30:50 158

原创 HTML&CSS2.1基础利用浮动、定位实现圣杯布局、双飞翼布局、伪等高布局、黏连布局，解决浮动元素高度塌陷问题，解决相邻垂直外边距重叠问题

###定位 1.定位元素参照于包含块来定位（均会覆盖原来文档流的元素）相对定位relative：相对与原来自身位置移动，元素并没有脱离文档流，原来的位置让仍然保持绝对定位absolute：相对于其自身相邻的开启了定位的祖先元素进行定位的，如果其祖先元素均没有开启定位，则相对浏览器进行定位。脱离文档流固定定位fixed：相对于浏览器窗口定位，固定定位不随滚动条滚动。脱离文档流。 2.什么是...

2020-05-02 11:12:32 359