随笔分类 -  html5初识

摘要:3D属性 1 <style> 2 .wrap { 3 position: relative; /*相对定位*/ 4 margin: 100px auto; 5 width: 400px; 6 height: 300px; 7 background: red; 8 transform: rotateY 阅读全文
posted @ 2020-04-27 10:35 潜伏r 阅读(208) 评论(0) 推荐(0) 编辑
摘要:上网搜 flex-shrink和flex-grow 1、transition过度 1 <style> 2 div { 3 width: 100px; 4 height: 100px; 5 background: red; 6 transition: width 2s 2s; 7 } 8 div:ho 阅读全文
posted @ 2020-04-16 17:00 潜伏r 阅读(240) 评论(0) 推荐(0) 编辑
摘要:1 <style> 2 .box{ 3 float: left; 4 width: 100px; 5 height: 100px; 6 background: url(images/3.jpg) no-repeat left top; 7 background-size: 50px; 8 paddi 阅读全文
posted @ 2020-03-25 18:24 潜伏r 阅读(136) 评论(0) 推荐(0) 编辑
摘要:1、css3初识 1 <style> 2 /* 3 CSS3 是最新的 CSS 标准。 4 为了提高开发速度,也为了方便各主流浏览器根据需要渐进式支持,css3按模块化进行了全新设计,这些模块可以独立发布和这实现,也为日后css的扩展奠定了基础。 5 6 其中最重要的 CSS3 模块包括: 7 选择 阅读全文
posted @ 2020-03-24 10:38 潜伏r 阅读(195) 评论(0) 推荐(0) 编辑
摘要:1、HTML5新增标签 HTML5代码 <!-- 整个文档的头部或者某个区块的头部 通常可以用来包含logo 搜索框 标题--> <header>这里是头部区</header> <!--整个文档的底部或者某个区块的底部 如包含友情链接、版权等 --> <footer>这里是页脚区</footer> 阅读全文
posted @ 2020-03-19 07:49 潜伏r 阅读(370) 评论(0) 推荐(0) 编辑
摘要:1、复习 1 <style> 2 *{ 3 margin: 0; 4 padding: 0; 5 } 6 a{ 7 display: block; 8 width: 150px; 9 height: 50px; 10 background-color: #00ffff; 11 font-size: 阅读全文
posted @ 2020-03-17 14:01 潜伏r 阅读(267) 评论(0) 推荐(0) 编辑
摘要:背景色 background-color dashed实线 透明度 文字不透明 <style> *{ margin: 0; padding: 0; } .box{ width: 200px; height: 200px; /*背景色 rgb() rgba() 透明不影响内容 a透明度 */ back 阅读全文
posted @ 2020-03-15 15:58 潜伏r 阅读(183) 评论(0) 推荐(0) 编辑
摘要:清除浮动-height 1 <style> 2 *{ 3 margin: 0; 4 padding: 0; 5 } 6 ul,ol{ 7 list-style: none; 8 } 9 .box{ 10 width: 800px; 11 /* height: 100px; */ 12 border: 阅读全文
posted @ 2020-03-14 21:23 潜伏r 阅读(170) 评论(0) 推荐(0) 编辑
摘要:盒子居中 对于span可以设置margin-left或者right,不能设置top和bottom 关键语句 margin:0 auto; 1 <style> 2 *{ 3 margin: 0; 4 padding: 0; 5 } 6 .box1{ 7 width: 400px; 8 padding: 阅读全文
posted @ 2020-03-13 09:54 潜伏r 阅读(157) 评论(0) 推荐(0) 编辑
摘要:清除默认样式 1 /*清空默认样式,设置初始样式*/ 2 *{ 3 margin: 0; 写法方便 4 padding: 0; 5 }/* 6 body,ul,li,p{ 7 margin: 0; 效率高 8 padding: 0; 9 }*/ line-height行高 color字体颜色 溢出隐 阅读全文
posted @ 2020-03-12 18:27 潜伏r 阅读(247) 评论(0) 推荐(0) 编辑
摘要:1 <style> 2 .p1 { 3 font-style: normal; 4 } 5 .p2 { 6 font-style: italic; 7 /* 假如英文字体本身有斜体的话 则显示斜体样式 假如没有则会替换成有斜体的字体 */ 8 } 9 .p3 { 10 font-style: obl 阅读全文
posted @ 2020-03-09 15:06 潜伏r 阅读(129) 评论(0) 推荐(0) 编辑
摘要:1 <style> 2 #box1 p { 3 color:red; 4 } 5 #box1 #box2 .box3 p { 6 color:green; 7 } 8 /* 9 !important 可以提升权重 10 在就近原则中,无法提升继承的权重 11 */ 12 .box1 .box2 p 阅读全文
posted @ 2020-03-08 16:16 潜伏r 阅读(192) 评论(0) 推荐(0) 编辑
摘要:通配选择器 *表示所有的标签 1 <div>div</div> 2 <p>p</p> 3 <h1>h1</h1> 4 <ul> 5 <li>item</li> 6 <li>item</li> 7 <li>item</li> 8 </ul> 1 <style> 2 /* 通配符选择器效率低 所以很多工 阅读全文
posted @ 2020-03-07 18:31 潜伏r 阅读(287) 评论(0) 推荐(0) 编辑
摘要:实体符(以&开头,以;结尾) < &lt; > &gt; 版权© &copy; 空格 &nbsp; 1 <em>倾斜</em> 2 <strong>加粗</strong> 3 <del>删除线</del> 不常用 1 <div> 2 <!-- 容器 --> 3 这是头部 4 </div> 5 <di 阅读全文
posted @ 2020-03-07 12:00 潜伏r 阅读(224) 评论(0) 推荐(0) 编辑
摘要:表单 1 <form> 2 <input type="text" /> 3 </form> value表示文本框的默认值,默认文本框并排 1 <form> 2 <input type="text" /> 3 <input type="text" value="请输入用户名"> 4 </form> 可 阅读全文
posted @ 2020-03-06 18:13 潜伏r 阅读(258) 评论(0) 推荐(0) 编辑
摘要:盒子模型布局稳定性 1、什么时候用内边距 什么时候用外边距 绝大多数情况下可以混用,想用什么就用什么,但是总有一个最好用的,建议 优先使用width 》 padding 》 margin 1 <style> 2 .box1{ 3 margin-left:200px; 4 } 5 p{ 6 paddi 阅读全文
posted @ 2020-03-06 14:56 潜伏r 阅读(291) 评论(0) 推荐(0) 编辑
摘要:锚点 从一段文字跳转到另一段文字 1 <p><a name=1></a>这是第一段.......</p> 2 <p>这是第二段</p> 3 <p>这是第三段</p> 4 <p>这是第四段</p> 5 <p>这是第五段</p> 6 <a href="#1">跳到第一段</a> 图片 单标记 <img  阅读全文
posted @ 2020-03-06 13:27 潜伏r 阅读(144) 评论(0) 推荐(0) 编辑
摘要:安装插件 open in browser 预览页面 image preview 编辑图片 vscode-icons 标签 快捷键 alt + 上下箭头 移动当前行 ctrl + / 注释/取消注释 shift + alt + a 添加或删除块注释 shift + alt + 上下箭头 复制当前行 原 阅读全文
posted @ 2020-03-05 21:50 潜伏r 阅读(136) 评论(0) 推荐(0) 编辑

点击右上角即可分享
微信分享提示