前端基础
Posted mengmeng1011
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了前端基础相关的知识,希望对你有一定的参考价值。
复习:
html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<!--行内标签-->
<!--自己有多大 就占多大-->
<!--白板标签-->
<!--display: block 行内和块级之间进行准换的css 属性-->
<span style="display: block">金牛座</span>
<!--块级标签-->
<!--无论自己有多大,都占满一整行-->
<!--伪白板标签-->
<div>金牛座</div>
<!--块-->
<h1>大师兄</h1>
<!--行内 内联-->
<a href="http://www.imdsx.cn">大师兄</a>
<!--文本框标签-->
<!--自闭合标签-->
<!--文本框-->
<input type="text">
<!--密文文本框-->
<input type="password">
<!--按钮-->
<input type="button">
<!--按钮 submit 如果 和form连用 则可以直接刷新页面进行提交数据-->
<input type="submit">
<!--重置 如果 和form连用 可以将文本内容初始化为默认值-->
<input type="reset">
<!--单选框-->
<input type="radio">
<!--多选框-->
<input type="checkbox">
<!--上传文件-->
<input type="file">
<!--下拉框-->
<select>
<option>金牛座</option>
<option>水瓶座</option>
<option>双鱼座</option>
</select>
<img src="http://ui.imdsx.cn/static/image/dsx_Small.jpg1" alt="失败的时候的属性" title="鼠标悬浮时展示的样式">
<table border="1">
<thead>
<tr>
<th>id</th>
<th>method</th>
<th>data</th>
<th colspan="2">操作</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>post</td>
<td rowspan="3">{}</td>
<td>执行</td>
<td>修改</td>
</tr>
<tr>
<td>1</td>
<td>post</td>
<td>执行</td>
<td>修改</td>
</tr>
<tr>
<td>1</td>
<td>post</td>
<td>执行</td>
<td>修改</td>
</tr>
</tbody>
</table>
<!--主动闭标签-->
<div></div>
</body>
</html>
CSS:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="s.css">
<style>
#i1{
background-color: red;
}
.c1{
background-color: black;
}
div {
background-color: green;
}
</style>
</head>
<body>
-<!--在html中有几个地方 可以对标签 进行css样式附着-->
<!--一对儿 html标签中的 id属性是唯一的 不可以重复-->
<div id="i1" class="c1">1</div>
<!--id>class>div-->
<!--class可以重复-->
<div class="c1">1</div>
<div class="c1">1</div>
<div class="c1">1</div>
<div class="c1">1</div>
<div>1</div>
由内到外 由近到远
<div style="background-color: pink">1</div>
<div style="border: 1px solid red;width: 200px;height: 400px;">
<div style="background-color: burlywood;width: 200px;height: 100px"></div>
</div>
<div style="background-color: red"></div>
<input value="" name="" style="" jnz="lihai">
</body>
</html>
以上是关于前端基础的主要内容,如果未能解决你的问题,请参考以下文章