接触HTML和CSS心得体会
1.HTML
它负责网页的三个要素之中的结构；
HTML使用标签的形式来标识网页中的不同组成部分
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>This is a Title</title>
</head>
<body>
<!-- html1中的标题标签：h1-h6 -->
<!-- h强调的是重要性 -->
<h1>This is the first Title</h1>
<h2>This is the second Title</h2>
<h3>This is the third Title</h3>
<h4>This is the fourth Title</h4>
<h5>This is the fifth Title</h5>
<h6>This is the sixth Title</h6>
<!-- 换行 -->
<br/>
<!-- 分割线 -->
<hr/>
safe
<hr/>
<!--
ul:unordered list:
1.在HTML文件中，可以利用成对的<ul></ul>标记来插入无序列表，中间的列表项标签<li></li>（list-items）用来定义列表项序列
2.使用无序列表标签ul的type属性（使用CSS的list-style来代替）。用户可以指定出现在列表项前的项目符号的样式，其取值以及相应的符号样式如
-->
<ul>
<li>张三</li>
<li>李四</li>
<li>王五</li>
</ul>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<!--
在html中使用form标签创建一个表单
action：代表要跳转到的目标地址
-->
<form action="table.html">
用户名：<input type="text" name="username" value="张三"/><br/>
密码：<input type="password" name="pass" ><br/>
<!-- html中的单选是通过name属性值来区分是否是同一组的 -->
性别：<input type="radio" name="sex"/>男<input type="radio" name="sex"/>女<br/>
爱好：<input type="checkbox" name="hobby" value="yu"/>羽毛球<input type="checkbox" name="hobby" value="basketball"/>篮球<input type="checkbox" name="hobby" value="football"/>足球<br/>
籍贯：
<!-- 对于select下拉列表而言，name属性和value属性是分开的 -->
<select name="address">
<option value="beijing">北京 </option>
<option value="shanghai">上海</option>
<option value="tianjin">天津</option>
</select> <br/>
<input type="submit" name="Submit"/>
</form>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<!--
img标签用于加载图片
alt:表示图片未正常加载的时候需要显示的信息
src:图片的路径
相对路径：表示的是相对于当前文件所在目录的路径
1）和当前文件在同一目录下
2）图片所在的目录和当前文件在同一文件夹
3）图片所在的目录是在当前文件的上一级或上级
绝对路径： http：//
-->
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<!-- 内部样式表 -->
<style type="text/css">
p{
color:red;
}
#sss{
color:pink;
}''
.ds{
font-size:20px;
}
</style>
</head>
<body>
<!-- 不建议将表现和构建写在一起
W3C建议将，骨架(html),表现(css),行为(js)三者分离开来
-->
<!-- 行内样式表 -->
<p>
床前明月光，<br/>
疑是地上霜，<br/>
举头望明月，<br/>
低头思故乡。<br/>
</p>
<!-- id:属性在整个html页面中必须是唯一的 -->
<p id="sss" class="ds">
我是什么颜色的？
</p>
<p id="sss" class="ds">
我是什么颜色的？
</p>
</body>
</html>
