码迷,mamicode.com
首页 > 其他好文 > 详细

前端基础(二)

时间:2020-06-21 23:39:17      阅读:54      评论:0      收藏:0      [点我收藏+]

标签:red   val   black   多选框   order   title   css   method   ima   

复习:

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>

前端基础(二)

标签:red   val   black   多选框   order   title   css   method   ima   

原文地址:https://www.cnblogs.com/mengmeng1011/p/13174256.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!