css
文章平均质量分 56
良良2号
小时候真傻,居然盼着长大。
展开
-
css之定位
定位让盒子自由地在某个盒子内移动位置,或者固定在屏幕上的某个位置,并且可以压住其他盒子。定位模式staticrelative相对于自己不脱标absolute(相对祖先)最近的那个祖先有定位,则参考它。否则以 浏览器(而不是body) 为准。常常结合有定位的父亲使用。脱标fixed固定于 浏览器可视区域。脱标紧贴版心:先设置left: 50%,再margin-left: 版心宽度一半sticky以 可视窗口 为参照点移动元素(固定定位特点)不脱标 (相对原创 2021-05-04 01:36:40 · 62 阅读 · 0 评论 -
css之浮动
浮动浮动的元素具有行内块元素的特点: 可以设置宽高,可以一行显示,但不设置宽高则根据内容显示。原创 2021-04-21 21:31:48 · 77 阅读 · 0 评论 -
css之属性(盒子属性)
字体属性/*复合属性*/<style> font: font-style font-weight font-size/line-height font-family;</style>/*顺序不可颠倒,并且font-size 和 font-family 不可省略*/文本属性em是一个相对单位,相对于当前元素(font-size)的大小。line-indent: 2em,首行缩进2字符行高控制的是文本的上下间距,文本本身高度并不发生改变。...原创 2021-02-26 13:50:51 · 254 阅读 · 0 评论 -
HTML5和CSS3
![`head](https://img-blog.csdnimg.cn/20210514205025538.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NDM4NjkzOQ==,size_16,color_FFFFFF,t_70)原创 2021-05-19 18:49:16 · 48 阅读 · 0 评论 -
css之特别效果
精灵图background: url() no-repeat x y字体图标配置字体图标库,并给需要字体图标的位置设计样式。font-family, content:引用图标库中的某个图标。color, font-size:修改字体图标样式。三角样式不设宽高,只设置边框粗细,形成正方形。绝对定位后,移到所需位置。给多余的三个边框颜色设置为透明。鼠标样式cursor: default | pointer | move | text | not-allowed表单outline原创 2021-05-17 12:50:54 · 57 阅读 · 0 评论 -
css易混淆知识点
背景图片和定位的图片第一种情况,图片超出了盒子的范围,背景图片没法做,只能用定位。第二种情况,既可以使用定位,也可以使用背景图片。其次,背景图片往往被"压住",而定位的图片往往"压住"别人。visibility和display设置了visibility: hidden的元素本质上还是占有文档流的位置,仍然具有宽高。而设置了display: none的元素本质上不占有文档流的位置,不具有宽高。实例下拉菜单往往脱离标准流,在鼠标经过的时候展示全貌。展示全貌的时候可能会 遮住 底下标准流中的元原创 2021-05-17 12:50:11 · 49 阅读 · 0 评论 -
css三大特性
层叠性相同的选择器,若定义相同的样式,则遵循 就近原则,以解决样式冲突的问题。继承性子元素继承父元素的 文字相关 的样式。行高的继承为了让子元素根据自己的文字大小自动调整行高。// 父元素样式<style> body { color: pink; font: 24px/1.5 'Microsoft YaHei'; }</style>// 子元素样式, div的行高为14*1.5=21px<style> div { font-s原创 2021-04-06 16:34:38 · 34 阅读 · 0 评论 -
css之块级/行内元素
块级元素(block)div,h1~h6,p,ul,ol,li等元素。宽高、内外边距都可以设置,宽度默认容器(父级元素)的100%。可以放块级元素或者行内元素,p和h1~h6标签除外。行内元素(inline)a,strong,b,em,i,del,s,u,span等元素。不能直接设置宽高,默认宽度为内容宽度。行内元素只能容纳文字和其他行内元素,a标签可以放块级元素,但a标签内不能放其他的a标签。行内块元素(inline-block)img,input,td等元素。一行可以放多个原创 2021-03-10 16:45:57 · 114 阅读 · 0 评论 -
css之选择器
选择器标签选择器选择某一类标签。<style> div { color: red; }</style>类选择器将相同功能的样式封装到类中,方便统一修改。<head> <style> .box { height: 100px; width: 100px; } .red { background-color: red;原创 2021-02-21 19:11:04 · 50 阅读 · 0 评论