web前端
1.B/S架构
B是browser（浏览器）用户使用的所有客户端（部分手机app，小程序），我们都可以把它视为浏览器，S是server（服务器）。浏览器发出请求，通过http等互联网协议发送至S端服务器，S端把网页文件发送至前端，B端浏览器收到文件后，浏览器解析成图形界面，可供用户操作。
<div>无实意标签</div>
<p>段落标签</p>
<span>无实意标签</span>
无序列表、有序列表、单选框、复选框、超链接、1~6级标题
这些都是最基础的标签，在下方代码中都有具体展示。
<!DOCTYPE html> <!--html5,html语言的第五个版本 超文本语言 一处发布，到处可以查看--> <html> <head> <!--头部，页面背景上的设置--> <meta charset="utf-8"> <!--meta元标签 charset编码格式--> <!-- GB-2312国家标准 --> <title>Hello，World！</title> </head> <body> <div>无实意标签</div> <p>段落标签</p> <span>无实意标签</span> <img src="https://t7.baidu.com/it/u=3635362084,1992212334&fm=193&f=GIF"> <ul type="circle"> <!-- 无序列表 --> <li>aaaaaa</li> <li>bbbbbb</li> <li>cccccc</li> </ul> <ol type="a"> <!-- 有序列表 --> <li>aaaaaa</li> <li>bbbbbb</li> <li>cccccc</li> </ol> <input type="text" name=""> <input type="number" name=""> <input type="password" name=""> 性别： <!-- 单选框 --> <input type="radio" name="gender">男 <input type="radio" name="gender">女<br> <!-- 复选框 --> <input type="checkbox" name=""> <!-- 超链接 --> <a href="https://www.baidu.com"> 百度一下 </a> <h1>1级标题</h1> <h2>2级标题</h2> <h3>3级标题</h3> <h4>4级标题</h4> <h5>5级标题</h5> <h6>6级标题</h6> </body> </html>
css优先级：
li{
color: red;
}
/*标签选择器 li ul*/
#xiaoMing{
color: pink;
}
/*id选择器,id唯一且不重复*/
.xiaoHong{
color: lightblue;
}
/*class类名选择器,可以重复*/
/*css优先级*/
/*1.后来者居上,越往后说了算
2.行内样式>头部样式>=外部样式
3.越精确越说了算id>class>标签
4.!important优先级最高,但是不到最迫不得已的时候不要用
*/
css常用属性：
width：宽度
height：高度
background：背景（复合属性）
background-color
background-image
background-repeat（-x/y）:no-repeat 平铺
若div高100px 且只有一行文字，若要垂直居中，则仅需要将行高设置为100px就可。（仅适用于单行垂直居中）
font-width 字体加粗100-900
text-indent: ; 首行缩进
line-height: ; 行高
4.行块属性
嵌套规则：
块标签里面可以放行内标签 反之不可
块标签
div，ul，li,ol,h1~h6,p 可以设置宽高 不可与别人共处一行 不设置宽度的情况下，默认宽度为100%
行标签
span,strong,a 不可以设置宽高 可与别人共处一行 其宽高由内容撑开
行内块标签
img,input 可以设置宽高 可以与别人共处一行
浙公网安备 33010602011771号