
Html+CSS
文章平均质量分 67
boxyuan
这个作者很懒,什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
伪元素,使用伪元素来清除浮动
伪元素: 在页面上不存在的元素,但是可以通过css来添加上去 种类: :before:after 注意:每个元素都有自己的伪元素 使用伪元素来清除浮动: .clearfix:after { content:""; height: 0; line-height: 0; display: block; clear: both;原创 2017-07-29 14:55:46 · 1025 阅读 · 0 评论 -
浮动
浮动: 解决一行中显示多个盒子的问题,并且这些盒子的位置可控 float:left float:right 标准流:浏览器默认摆放盒子的标准 浮动的特点: 浮动的元素会脱离标准流: 如果一个元素按照正常的标准来显示会在html中所属的位置占位,后面的元素会紧跟着他,但是浮动脱离了标准流,将来在看到浮动的元素之后,不能以正常的标准来进行判断 浮动以后的元素会覆盖标准流原创 2017-07-28 18:37:22 · 423 阅读 · 0 评论 -
文章列表,行高的单位,行高与font关系,margin特殊现象
/*清除标签默认的padding和margin*/ *{ padding: 0; margin: 0; } body { background-color: gainsboro; } .content{ width: 328px; height: 226px; border: 1px solid #00BFFF;原创 2017-07-28 17:50:04 · 529 阅读 · 0 评论 -
盒子模型
盒子模型: 概念:在写一个html页面的时候,其实就相当于在这个页面中叠盒子。 思想:万物皆盒子 具体内容: 盒子的挡板:border 盒子的泡沫:padding 盒子里的物品:content 盒子与盒子之间的距离:margin boder:盒子的挡板 div{ width: 200px; height: 200px; background-col原创 2017-07-27 21:30:41 · 467 阅读 · 0 评论 -
行高等于容器高度可以垂直居中
行高: 应用:如果行高等于容器行高那么元素在父容器中垂直居中 问题:为什么行高等于容器的高度,元素在父容器中垂直居中? 行高的定义:两行文本之间基线的距离叫行高 div{ display: inline-block; text-align: center;/*水平居中*/ background-color: plum; widows: 100px;原创 2017-07-27 16:30:44 · 1931 阅读 · 0 评论 -
锚伪类的四种伪类
伪类: 与类选择器相似但是又有所不同 锚伪类: a:link { color: #2AABD2; font: "微软雅黑"; font-size: 50px; } 作用:给a标签设置没有访问过的样式 a:visited a:visited { color: palevioletred; font: "微软雅黑";原创 2017-07-27 16:03:29 · 926 阅读 · 0 评论 -
html相关
声明位于html标签最前面,定义文档规范 现在都用H5规范标准: 标签里面用来存放 title,meta,base,style,script,link,head标签中必须设置的标签是title ------------------------------------------------------------------- SEO:搜索引擎优化 ---原创 2017-07-24 15:56:16 · 302 阅读 · 0 评论 -
透明度,margin为负数的应用,圣杯布局,倒三角
如果定位的盒子没有宽高,那么默认宽高为0如果给子盒子设置宽度为100%,那么这个子盒子的宽与父盒子一样宽透明度:opacity,取值0-1之间的小数 margin为负数的应用 如果margin-left设置为负数,那么将来这个盒子会像左方向移动 如果margin-right设置为负数,那么盒子向右移动 圣杯布局 左右两边内容保持不变,中间内容根据浏览器大小而改变 圣杯原创 2017-08-03 10:47:36 · 564 阅读 · 0 评论 -
表格与表单
it大佬资料 id 姓名 班级 专业 1 马云 50 阿里 2 马化腾 48 腾讯 3 李彦宏 48 百度 4 雷军 48 小米原创 2017-07-24 16:56:50 · 280 阅读 · 0 评论 -
a标签的几种用法
1、跳转到同一目录的页面 例:同一目录下有1.html,2.html,在1.html里面利用a标签跳转到2.html,跳转到2.html 2、a标签可以不跳转 点我看看有没有反映 3、可以在当前页面定位 top即定位到p标签id为top,利用页面定位可以定位到页面的其他位置 4、在目标页面指定位置定位 跳转到指定页面的上部 -----------------------------原创 2017-07-24 14:30:57 · 2028 阅读 · 0 评论 -
绝对路径与相对路径
绝对路径:文件带有盘符的路径 相对路径: html文件与图片在同一级路径下面: 如果html文件在图片的上一级目录: 图片在文件的上一级目录:../跳出当前目录回到上一级目录原创 2017-07-24 11:32:41 · 212 阅读 · 0 评论 -
z-index,标签之间的嵌套规则,精灵图,整站练习(css初始化)
z-index定位: 作用:设置页面中元素的层级关系 取值:正整数 标签之间的嵌套规则: 行内元素只能包含行内元素 块级元素可以包含所有的行内元素和部分块内元素p标签h标签不能包含块级元素 精灵图: 将页面上较小的图放在一张大图上 制作精灵图: 精灵图必须是小的图片精灵图之间一定要留有足够的间隙精灵图的大小一定要大于所有的图片中最大 的那原创 2017-07-30 18:18:36 · 695 阅读 · 0 评论 -
设置文本与图片的对其方式,元素的隐藏
overflow:溢出 取值: hidden 会将超出容器的部分隐藏起来 scroll:给容器加上滚动条auto:根据具体情况判断容器是否要加上滚动条 元素的隐藏 overflow:hidden 将超出部分裁剪掉 visibility:hidden可以及将元素隐藏,但是在页面上还保留着原来的位置 display:可以将元素隐藏,并且在页面不占据位置 display:none原创 2017-07-30 08:17:06 · 357 阅读 · 0 评论 -
让小盒子在大盒子中水平居中,固定定位
* { margin: 0; padding: 0; } .big { width:600px; height: 300px; background-color: powderblue; margin: 0 auto; position: relative; } .small { w原创 2017-07-29 15:55:05 · 2035 阅读 · 0 评论