这是我学代码的笔记,如果有什么不对的请指出谢谢ww
师傅:西南白
网页基本骨架
<html>
<head>
</head>
<body>
</body>
</html>
引入css
<link rel="stylesheet" type="text/css" href="X.css">(放在head里)【也可放在body里】
使用汉字
<meta charset="utf-8">(放在head里)【还有gbk、gb2312等】
图片
加入图片:<img class="X" src="图片地址" alt="(描述图片)">
或background: url("图片地址");
页面宽充满一张:background-size:cover;【以中心为主铺满 div 但是不一定把图片内容全显示出来】
原尺寸:max-width:100%;
固定取图片中间一部分:background-position:50% 50%;(数字为参照)
浮动和清除浮动
例:
float:left
clear:left/clear:both
clearfix清除浮动
.clearfix:before, .clearfix:after {
content:" ";
display:table;
}
.clearfix:after {
clear:both;
}
.clearfix {
zoom:1;
}
任意摆放元素
position:absolute;(以整个页面为参照)
position:relative;(以其它元素为参照,加在被参照元素里)
一般配合top、left等
如果加padding导致超过宽被挤到下一行
* {
box-sizing:border-box;
}
块变圆
border-radius:50%;(数字为参考)
加阴影
box-shadow:0 5px 5px rgba(0,0,0,0.1);(数字为参考)
取消下划线
text-decoration:none;
不随网页下滑/固定
position:fixed;
居中
margin:0 auto;
或position:fixed;(一般配合top、left、margin-left等)
字体
常见宋体,数字为大小参照:
font: 14px/1.5 "Helvetica Neue",Helvetica,Arial,"Microsoft Yahei","Hiragino Sans GB","Heiti SC","WenQuanYi Micro Hei",sans-serif;(参考其他网站)
居中:
text-align:center;
常见字粗:
font-weight:normal;
网友评论