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>

  

接触HTML和CSS心得体会的更多相关文章

  1. css心得体会

    非块级元素  要使得其有长宽的效果  可以设置  margin  和  padding 块级元素     可以直接设置  width  和  height div标签   要使得你内部元素居中   可 ...

  2. 百度api使用心得体会

    最近项目中在使用百度地图api,对于其中的一些有用的点做一些归纳整理,如有不对的地方,欢迎各位大神纠正指出. 一定要学会查找百度地图api提供的类参考网站:http://lbsyun.baidu.co ...

  3. 今天看了几个小时的微信小程序说说心得体会

    今天看了几个小时的微信小程序说说心得体会 小程序是个前端框架 根据微信相关提供了很多接口 1 先说说各种后缀的文件 .json 后缀的 JSON 配置文件.wxml 后缀的 WXML 模板文件.wxs ...

  4. "亿家App"问卷调查分析结果及心得体会

    一.问卷问题设计 调查背景:随着现代社会互联网的发展,基于家庭产生的服务项目也越来越多.为增加家庭之间的交流和互助,增加家庭内部.家庭与家庭之间的沟通互助,并利用互联网便捷交流的优势,使家庭在享受服务 ...

  5. 软工-五月心得体会 PB16110698

    伴随着愈发红润的骄阳,火热而紧张刺激的五月悄然而至.这一个月以来,曾经让同学们“废寝忘食”的软工课大作业终于告一段落,每周一篇的读书笔记也缓到半月一篇,着实令人长吐一口气.但这一份表面的余裕当然没有看 ...

  6. Java初学者最近三次作业的心得体会

    作为一个初学者,简单的谈一下自己的作业心得体会.如果你是完全没有接触过Java的学习,本篇博文可能会有些收获,如果你已经学习Java有一段时间了,那么可以放弃这篇文章了,因为这篇文章讲解的是基本的东西 ...

  7. 兼容低版本IE浏览器的一些心得体会(持续更新)

    前言: 近期工作中,突然被要求改别人的代码,其中有一项就是兼容IE低版本浏览器,所以优雅降级吧. 我相信兼容低版本IE是许多前端开发的噩梦,尤其是改别人写的代码,更是痛不欲生. 本文将介绍一些本人兼容 ...

  8. 从实例学习 Go 语言、"基础与进阶" 学习笔记及心得体会、Go指南

    第一轮学习 golang "基础与进阶"学习笔记,Go指南练习题目解析.使用学习资料 <Go-zh/tour tour>.记录我认为会比较容易忘记的知识点,进行补充,整 ...

  9. 关于Solr的使用总结的心得体会

    摘要:在项目中使用Solr作为搜索引擎对大数据量创建索引,提供服务,本文是作者对Solr的使用总结的一点心得体会, 具体包括使用DataImportHandler从数据库中近实时同步数据.测试Solr ...

随机推荐

  1. RabbitMQ之Topics(多规则路由)

    Exchange中基于direct类型无法基于多种规则进行路由. 例如分析syslog日志,不仅需要基于severity(info/warning/critical/error)进行路由,还需要基于a ...

  2. replace() 所有单词首字母大写

    function ReplaceDemo() { var r,re; var s="The quick brown fox jumpe dover the lazy yellow dog.& ...

  3. 机器学习(二)-kNN手写数字识别

    一.kNN算法是机器学习的入门算法,其中不涉及训练,主要思想是计算待测点和参照点的距离,选取距离较近的参照点的类别作为待测点的的类别. 1,距离可以是欧式距离,夹角余弦距离等等. 2,k值不能选择太大 ...

  4. SpringMVC 表单验证

    SpringMVC 表单验证 本章节内容很丰富,主要有基本的表单操作,数据的格式化,数据的校验,以及提示信息的国际化等实用技能. 首先看效果图 项目结构图 接下来用代码重点学习SpringMVC的表单 ...

  5. 01_Python简介

    Python 简介 *为什么学习python http://bbs.fishc.com/thread-35584-1-1.html Python 特点 易于学习:Python有相对较少的关键字,结构简 ...

  6. SharePoint 路在何方?

    听着老版<西游记>熟悉的片头曲,想着九寨沟取景的地点现在已然不在了,看着自己的现状,真是五味杂陈.从2010年至今,接触SharePoint已经是第七个年头了,不知不觉都已经成为习惯.从2 ...

  7. 极光推送_总结_01_Java实现极光推送

    一.代码实现 1.配置类—Env.java package com.ray.jpush.config; /**@desc : 极光推送接入配置 * * @author: shirayner * @da ...

  8. MatlabR2015b用了一段时间之后需要重新激活

    问题描述:MatlabR2015b安装成功,用了一段时间之后需要重新激活,按照http://www.cr173.com/soft/490645.html教程,无法激活成功,卸载重新安装也不行. 解决方 ...

  9. makefile中伪目标的理解

    1. 我们知道Makefile中的语法是这样: target ... : prerequisites ... command - - 2. 假如编译两个文件可以这么写: a.o:a.c  gcc -c ...

  10. HTTP 2 新特性

    HTTP 2 新特性 HTTP/2 不是彻底的重写http协议,HTTP methods,status codes 和 语义化都是相同的,并且它应该使用和HTTP/1.x 相同的api 表示协议. H ...