随笔分类 - Html 和 Css
摘要：<style> /*原理：第一步*/ .box1{ width: 0; height: 0; border-top: 50px solid green; border-right: 50px solid red; border-bottom: 0px solid yellow; /*1.底边去除就变
阅读全文
摘要：代码 <style type="text/css"> *{/*去除默认的距离*/ margin: 0; padding: 0; } .box{text-align: center;} /*让盒子内所有a元素水平居中*/ .box a{ display: inline-block; width: 36
阅读全文
摘要：解决代码 <style> .pro li{ list-style: none; width: 150px; height: 200px; float: left; border: 1px solid red; /*关键：给每个盒子加一个-1的位置，即向左移动1像素*/ margin-left: -1
阅读全文
摘要：文档：https://www.w3school.com.cn/css/pr_pos_vertical-align.asp <style> .inline1 img{ width: 50px; height: 50px; border-radius:25px; /*vertical-align：bas
阅读全文
摘要：三角写法： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>小三角
阅读全文
摘要：一、基础使用字体图标 常用下载： https://icomoon.io/ 的ico的app即： https://icomoon.io/app/#/select 选择——创建——下载 https://www.iconfont.cn/ 二、下载下来的字体解压 把内部的fonts文件夹拿出来放入项目根目录
阅读全文
摘要：<style> .f2{ width: 200px; height: 200px; background-color: red; /*第一步：设置定位为absolute*/ position: absolute; /*第二步：当前盒子的边：定位于，窗口正中，注意只是边定位于中心了*/ top:50%
阅读全文
摘要：效果： <style> .f1{ /*设置版面宽度为800*/ width: 800px; height: 800px; background-color: skyblue; /*版面让左右自动实现居中*/ margin:0 auto; } .f2{ width: 100px; height: 20
阅读全文
摘要：1.单行省略号 .p01{ width: 400px; /*1.必须有宽度否则无效*/ white-space:nowrap; /*2.文字必须强制不换行*/ overflow: hidden; /*3.此必须加否则无效*/ text-overflow: ellipsis; /*4文字超出显示省略号
阅读全文
摘要：基本的CSS样式编写时，很多样式只需输入首字母即可得到不带属性值的CSS样式，像上面说到的margin。 1、而对于一些带有特定的属性值的CSS样式，只需输入CSS标签与属性值的首字母就可以，比如： fl → float: left; 2、而在编写这些CSS样式时，有很多是我们想好的写法，但生成的不
阅读全文
摘要：一、emmet安装方法： 步骤一：首先你需要为sublime text安装Package Control组件： 按Ctrl+`调出sublime text的console 粘贴以下代码到底部命令行并回车： import urllib2,os;pf='Package Control.sublime-p
阅读全文
摘要：<script type="text/javascript" src="./files-m/jquery-1.9.1.min.js"></script> <script > //网页加载时运行 $(function(){ navHeader(); $(window).scroll(function
阅读全文
摘要：一、文件目录结构 https://blog.csdn.net/u010132177/article/details/108662975 mobile.css pc.css Index.html 二、响应式布局头部写法、media query https://www.runoob.com/cssref
阅读全文
摘要：一、cs3选择器 https://www.w3school.com.cn/cssref/css_selectors.asp Class^=,Class*= ,Class$= 其实就是一个使用正则的属性通配符selector 解释： [attribute^=value]，a[src^="https"]
阅读全文
