html与css
关注
分享
扫一扫
陀陀吖
有朋自远方来，不亦乐乎。
展开
-
表格 表单 标签 002
表格 表单 表格标题2 1 2 3 姓名 年龄 性别 小林 晓丽 小札 17岁 18岁 <!-- 1...原创 2019-03-25 23:24:59 · 213 阅读 · 0 评论 -
滑推门017
a{ /* 左边放左圆角，但padding-left要有*/ margin: 100px; height: 33px; display: block; background:url(../images/left.png) no-repeat left; color: #fff;} /*右边放右圆角，右对齐*/span{ background: ...原创 2019-03-31 23:17:15 · 122 阅读 · 0 评论 -
垂直居中对齐问题016
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>垂直居中对齐问题</title> <style> img{ vertical-align: middle; /*让图片与文字中线对齐 top basel...原创 2019-03-30 12:02:15 · 131 阅读 · 0 评论 -
取消input等的轮廓ouline 015
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>取消轮廓</title> <style> input{ outline: none; /*取消轮廓的方法*/ border: 1px solid red; ...原创 2019-03-30 12:01:27 · 243 阅读 · 0 评论 -
overflow隐藏加省略号014
div{ width: 200px; height: 200px; background-color: pink; /*overflow: hidden; */ /*溢出隐藏*/ /*overflow: scroll; */ /*这种总是自动添加滚动条 太丑不要用*/ /*overflow: auto;*/ /*超出就加滚动条，不超出就不添加滚动条*/ cursor: p...原创 2019-03-30 11:54:49 · 813 阅读 · 0 评论 -
图片透明遮罩013
a{ display: block; width: 200px; height: 100px; position: relative; } .mask{ width: 100%; height: 100%; background: rgb(0,0,0,.4) url() no-repeat center; position: absolute; left:...原创 2019-03-30 11:52:49 · 127 阅读 · 0 评论 -
显示与隐藏012
div{ width: 200px; height: 200px; background-color: pink; /*第一种方法*/ /*display:block; 显示 y有默认值block或者inline*/ display: none; /*隐藏元素 ==》 display:block 显示元素*/ ！！！！注意隐藏之后不占位置 /*第...原创 2019-03-30 11:51:00 · 116 阅读 · 0 评论 -
两个盒子合并边框大一倍解决方法011
<div></div><div></div><div></div><div></div><div></div>div{width: 200px;height: 400px;border: 4px solid red;float: left;margin-l...原创 2019-03-30 11:45:12 · 982 阅读 · 0 评论 -
z-index叠放次序010
<div class="red"></div><div class="yellow"></div><div class="blue"></div>div{ width: 200px; height: 200px; background-color: pink; position: absolute; ...原创 2019-03-30 11:31:11 · 135 阅读 · 0 评论 -
定位009
/*定位position 子绝父相1、静态定位：static,m默认定位，作用是取消定位2、相对定位：relative 脱标，占有位置3、绝对定位：absolute 脱标，不占位置 没有父级定位会以窗口定位为主4、固定定位 fixed 只和body浏览器窗口位置，与父级没有关系，只认浏览器窗口为父级 一定要给宽度 是特殊的绝对定位*//*加了position和overflow...原创 2019-03-30 11:28:15 · 93 阅读 · 0 评论 -
好用css属性 清除浮动 008
1、css属性：2、清除浮动/*1、clear:both 清除左边和右边浮动2、在最后一个浮动标签后面添加空标签来清除浮动3、父级overflow:hidden 推荐，别加错位置，要给父亲加上4、伪类元素清除浮动：第一种方法/*下面两句话要记住就好了*/.clearfix:after{ /*正常浏览器清楚浮动 五句话必须要有*/ content:""; disp...原创 2019-03-30 11:20:36 · 173 阅读 · 0 评论 -
权重选择器优先级 背景007
个人笔记，请勿借鉴！！！！！！！！！！原创 2019-03-30 11:14:32 · 134 阅读 · 0 评论 -
搜索引擎优化019
**一、站内优化**三大标签1、title：具有不可替代性，页内第一个重要标签，是搜索引擎了解网页的入口，网页主题，一般 ，网站名（产品名）+网站介绍用法：2、description：理论上不超过一百字的网站说明**3、Keywords：**6-8字关键字说明**二、logo的优化**结构布局：css样式：...原创 2019-03-27 23:35:06 · 217 阅读 · 0 评论 -
字体图标的引用018
**（一）引用图标**1、先去找到要用的字体图标，下载下来，icomoon.io网址2、解压，将fonts文件夹复制到项目文件夹里面，其他的先别删除3、开始将字体图标引入，看下面style里面的代码@font-face { /声明字体，引用字体/font-family: “icomoon”; /这里的iconfont我们可以改，表示字体的官网/src: url...原创 2019-03-26 21:02:55 · 1097 阅读 · 0 评论 -
sublime快捷键 块元素行元素 005
快捷键 <!-- ul>li>a+tab键 包含关系--><ul> <li><a href=""></a></li></ul><div> <p><a href=""><span></span><...原创 2019-03-25 23:48:07 · 226 阅读 · 0 评论 -
子代选择器后代选择器 004
子代选择器后代选择器 一级菜单 二级菜单 二级菜单 二级菜单 <!-- 交集选择器和并集选择器 --><div class="red">111</div><div>1111</div><div>1111</div>&...原创 2019-03-25 23:43:00 · 159 阅读 · 0 评论 -
css 属性 003
css 属性 傻瓜 傻瓜 傻瓜 傻瓜 傻瓜 傻瓜<!-- id选择器 --> <!-- id选择器就像一个人的身份证，一个人的都是唯一的，一个标签只能是一个，不能重复 --><div id="div1">臭肉</div><div i="div2">臭肉</div><div id...原创 2019-03-25 23:40:42 · 142 阅读 · 0 评论 -
html常用基础标签001
标签 标题标签大小不同 标题标签大小不同 标题标签大小不同 标题标签大小不同 标题标签大小不同 标题标签大小不同 <p>段落标签</p> <hr> <!-- 水平线标签 --><br> <!-- 换行标签 --><span>块级标签</sp...原创 2019-03-25 22:21:51 · 294 阅读 · 0 评论