如何做网站支付接口,用公司网站后缀做邮箱,上海网页制作教程,网站后台 添加用户css常用的一些属性#xff1a; 1.去掉下划线 #xff1a;text-decoration:none ;2.加上下划线#xff1a; text-decoration: underline; 3.调整文本和图片的位置#xff08;也就是设置元素的垂直对齐方式#xff09;#xff1a;vertical-align:-20px; 没设置之前#xf…css常用的一些属性 1.去掉下划线 text-decoration:none ;2.加上下划线 text-decoration: underline; 3.调整文本和图片的位置也就是设置元素的垂直对齐方式vertical-align:-20px; 没设置之前 设置之后 3.外边距margin4.内边距padding5.居中margin 0 auto;(只是针对盒子居中) 6内联标签是不可以设置长宽的有时候就得把内联标签变成块级标签或者块级内联标签这就用到了display标签。。 1.将内联标签转换成块级标签display:block; 2.将块级标签转换成内联标签display:inline; 3.块级内联标签displayinline-block; 块级内联标签可以像块级一样可设长宽也可像内联一样在一行显示6.隐藏的两个方法display:none; #隐藏了会顶上去 visibility :hidden; #隐藏了不会顶上去7.隐藏溢出的两个方法overflow :auto; overflow :scoll; #带滚动条8.文本水平居中text-align:center; 文本垂直居中line-height;9.伪类 1.没访问之前 a:link{color:red;} 2.鼠标悬浮时 a:hover{color:green;} 3.访问过后 a:visited{color:yellow;} 4.鼠标点击时 a:active{color:blue;} 5.在p标签属性为c2的后面加上内容 p.c2:after{ content:hello; color:red; }6.在p标签属性为c2的钱面加上内容 p.c2:before{ content:啦啦啦; color:red; }10.position的四种属性 1.static默认位置 2.fixed完全脱离文档流固定定位(以可视窗口为参照物) 3.relative:相对定位(参照的是自己本身的位置)没有脱离文档流没有顶上去会保持自己的位置不动。可以使用top left进行定位 4.absolute:绝对定位脱离了文档流参照的是按已定位的父级标签定位如果找不到会按body的去找注意将定位标签设置为absolute将他的父级标签设置为定位标签 relative11.float和position的区别 float半脱离文档流 position全脱离文档流12.z-index 属性设置元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。 //测试z-index
!DOCTYPE html
html langen
headmeta charsetUTF-8titleTitle/titlestyle.img1 {position:absolute;left:0;top:0;z-index:-10;}.img2 {position:absolute;left:0;top:0;z-index:-3; //越大越往前排离你越近}.img3 {position:absolute;left:0;top:0;z-index:-5;}/style
/head
body
div classimg3img src作业/1.jpg alt/div
div classimg2img src作业/2.jpg alt/div
div classimg1img src作业/3.jpg alt/div
/body
/html13.透明度opacity:0.4;14.边框弧度border-radius: 50%;15.去除列表前面的标志list-style:none;16.对齐上面和左边最顶部padding:0; margin:0;17.字体加粗样式 font-weight: 900; 18.需要注意的几个逻辑表达式的问题下面的这个和js的||用法是一样的 print(3 and 5) #两个为真才为真 print(0 and 3) #0是假就不判断后面了直接成假了 print(0 or 3) #有一个为真就为真 print(2 or 3) #2已经为真了那么就不会去判断后面了 //实现图片切换的效果
!DOCTYPE html
html langen
headmeta charsetUTF-8titleTitle/titlestyle*{padding:0;margin: 0;}.outer{width:790px;height: 340px;border: solid 1px red;margin: 0 auto;margin-top: 40px;position: relative;}ul{list-style: none;position: absolute;top: 0;left:0;}.com{position: absolute;display: none;/*visibility: hidden;*/}.num{position: absolute;top: 300px;left: 330px;}.num li{display: inline-block;width: 20px;height: 20px;color: black;background-color: white;border-radius: 50%; //边框弧度line-height: 20px;text-align: center;}.btn{position: absolute;width: 40px;height: 60px;background-color: grey;opacity: 0.5; //透明度color: black;font-weight: 900; //加粗text-align: center;line-height: 60px;top:50%;margin-top: -30px;}.leftbtn{left:0;}.rightbtn{right:0;}/style
/head
body
div classouterul classimglia hrefimg src1.jpg alt/a/lili classcoma hrefimg src2.jpg alt/a/lili classcoma hrefimg src3.jpg alt/a/lili classcoma hrefimg src4.jpg alt/a/lili classcoma hrefimg src5.jpg alt/a/lili classcoma hrefimg src6.jpg alt/a/li/ulul classnumli/lili/lili/lili/lili/li/uldiv classleftbtn btn /divdiv classrightbtn btn /div/div/body
/html//后台管理布局
!DOCTYPE html
html langen
headmeta charsetUTF-8title后台管理布局/titlestyle*{margin: 0;}a{text-decoration: none;}.header{width: 100%;height: 44px;background-color: #2459a2;}.title li{width: 100px;height: 80px;list-style: none;text-align: center;line-height: 80px;margin-top: 20px;padding: 50px;background-color: blue;}.leftmenu .title a{font-size: 18px;color: white;}.leftmenu{width: 300px;background-color: grey;position: fixed;top: 44px;left:0;bottom: 0;}.con{position: fixed;top: 44px;left: 300px;right:0;bottom: 0;background-color: darksalmon;overflow: scroll;}/style
/head
body
div classheader/div
div classcontentdiv classleftmenuul classtitlelia href菜单一/a/lilia href菜单二/a/lilia href菜单三/a/li/ul/divdiv classconh1hellp/h1h1hello/h1h1hello/h1/div
/div
/body
/html//遮盖层
!DOCTYPE html
html langen
headmeta charsetUTF-8title遮罩层/titlestyle.backgroup{width: 100%;height: 2000px;}.zzc{position: fixed;bottom: 0;top:0;left:0;right:0;background-color: grey;opacity: 0.4;}/style
/head
body
div classbackgroupphaiyan/pphaiyan/pphaiyan/pphaiyan/pphaiyan/pphaiyan/pphaiyan/pphaiyan/pphaiyan/pphaiyan/pphaiyan/pphaiyan/pphaiyan/p
/div
div classzzc/div
/body
/html转载于:https://www.cnblogs.com/xiaohema/p/8455449.html
