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. httpwebrequest 用GET方法时报无法发送具有此谓词类型的内容正文

    如下一段小程序,运行结果报无法发送具有此谓词类型的内容正文的错误,其实原因很简单,因为用的是GET的方式进行提交,而GetRequestStream()是用来在post提交的时候写post的内容的流, ...

  2. c#简单实现二维数组和二维数组列表List&lt;&gt;的转置

    刚看到网上一篇文章里用sql实现了行列转置.sql server 2005/2008只用一个pivot函数就可以实现sql server 2000很多行的复杂实现.提到转置,立刻想起还在求学阶段曾经做 ...

  3. Linux命令kill和signal

    Linux命令kill和signal kill命令用于终止指定的进程(terminate a process),是Unix/Linux下进程管理的常用命令.通常,我们在需要终止某个或某些进程时,先使用 ...

  4. 流式数据分析模型kafka+storm

    http://www.cnblogs.com/panfeng412/archive/2012/07/29/storm-stream-model-analysis-and-discussion.html ...

  5. C# 排序技术研究与对比

    一. 排序场景 一维数组排序 多维数组排序 集合排序,例如Dictionary ,List<T>, 自定义类集合排序等 DataTable排序 二. 排序实现和测试 1. 一维数组排序 1 ...

  6. Memcached 及 Redis 架构分析和区别比较

    Memcached和Redis作为两种Inmemory的key-value数据库,在设计和思想方面有着很多共通的地方,功能和应用方面在很多场合下(作为分布式缓存服务器使用等) 也很相似,在这里把两者放 ...

  7. 父类清除浮动的原因、（清除浮动代码，置于CSS中方便调用）

    浮动因素在静态网页制作中经常被应用到,比如要让块级元素不独占一行,常常应用设置float的方式来实现.但是应用的时候会发现,设置了子类浮动后,未给父类清除浮动,这样就会造成一下问题: 1.浮动的元素会 ...

  8. 开源纯C#工控网关+组态软件(六)图元组件

    一.   图元概述 图元是构成人机界面的基本单元.如一个个的电机.设备.数据显示.仪表盘,都是图元.构建人机界面的过程就是铺排.挪移.定位图元的过程. 图元设计是绘图和编码的结合.因为图元不仅有显示和 ...

  9. 案例学习总结：原生JS实现表格排序

    最近在学习js的表格排序,没想到看不起眼的表格排序实际上却暗含了众多JS知识点.在这里记录一下此次学习过程.希望对大家也有所帮助. 完整的表格排序涉及了下列这些知识点: call方法使用 sort方法 ...

  10. apache编译安装 httpd 2.2 httpd 2.4

    #apache编译安装#httpd 2.2 , httpd 2.4 #!/bin/sh #apache编译安装 #httpd 2.2 , httpd 2.4 #centos #rpm -e httpd ...