接触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:
-->
<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心得体会的更多相关文章
- css心得体会
非块级元素 要使得其有长宽的效果 可以设置 margin 和 padding 块级元素 可以直接设置 width 和 height div标签 要使得你内部元素居中 可 ...
- 百度api使用心得体会
最近项目中在使用百度地图api,对于其中的一些有用的点做一些归纳整理,如有不对的地方,欢迎各位大神纠正指出. 一定要学会查找百度地图api提供的类参考网站:http://lbsyun.baidu.co ...
- 今天看了几个小时的微信小程序说说心得体会
今天看了几个小时的微信小程序说说心得体会 小程序是个前端框架 根据微信相关提供了很多接口 1 先说说各种后缀的文件 .json 后缀的 JSON 配置文件.wxml 后缀的 WXML 模板文件.wxs ...
- "亿家App"问卷调查分析结果及心得体会
一.问卷问题设计 调查背景:随着现代社会互联网的发展,基于家庭产生的服务项目也越来越多.为增加家庭之间的交流和互助,增加家庭内部.家庭与家庭之间的沟通互助,并利用互联网便捷交流的优势,使家庭在享受服务 ...
- 软工-五月心得体会 PB16110698
伴随着愈发红润的骄阳,火热而紧张刺激的五月悄然而至.这一个月以来,曾经让同学们“废寝忘食”的软工课大作业终于告一段落,每周一篇的读书笔记也缓到半月一篇,着实令人长吐一口气.但这一份表面的余裕当然没有看 ...
- Java初学者最近三次作业的心得体会
作为一个初学者,简单的谈一下自己的作业心得体会.如果你是完全没有接触过Java的学习,本篇博文可能会有些收获,如果你已经学习Java有一段时间了,那么可以放弃这篇文章了,因为这篇文章讲解的是基本的东西 ...
- 兼容低版本IE浏览器的一些心得体会（持续更新）
前言: 近期工作中,突然被要求改别人的代码,其中有一项就是兼容IE低版本浏览器,所以优雅降级吧. 我相信兼容低版本IE是许多前端开发的噩梦,尤其是改别人写的代码,更是痛不欲生. 本文将介绍一些本人兼容 ...
- 从实例学习 Go 语言、"基础与进阶" 学习笔记及心得体会、Go指南
第一轮学习 golang "基础与进阶"学习笔记,Go指南练习题目解析.使用学习资料 <Go-zh/tour tour>.记录我认为会比较容易忘记的知识点,进行补充,整 ...
- 关于Solr的使用总结的心得体会
摘要:在项目中使用Solr作为搜索引擎对大数据量创建索引,提供服务,本文是作者对Solr的使用总结的一点心得体会, 具体包括使用DataImportHandler从数据库中近实时同步数据.测试Solr ...
随机推荐
- let 和const与var的不同
1. let的作用域在代码块中仅限在当前的作用于中 { var str1 = 12; console.log(str1); let str2 = 20; console.log(str2); //20 ...
- linux如何查看端口被谁占用
1.查看端口是否被占用 [guosong@alice48 main]$ netstat -nlp|grep 6184 (Not all processes could be identified, n ...
- Python手动实现k-means
import numpy as np import matplotlib.pyplot as plt def kmeans(data, cluster_num, method='mean'): poi ...
- ERP服务器简单维护
前言: 此页内容对于网管高手来说是小儿科,但是以我们对大多数企业的了解,依然有好多企业将服务器的日常维护给忽视了. 所以在此,给大家做一个宣传.让大家提高服务器维护的意识 以提高服务器运行的稳定性.安 ...
- python学习笔记 python实现k-means聚类
# -*- coding: utf-8 -*- """ Created on Thu Mar 16 14:52:58 2017 @author: Jarvis " ...
- c#使用PortableDeviceApiLib读取便携式设备(WPD:Windows Portable Devices)信息
相关名词解释: WPD( Windows Portable Devices) 译作Windows 便携设备 (WPD) 是一种驱动程序技术,可支持广泛的可移动设备,比如移动电话.数码相机和便携媒体播放 ...
- 1005:I Think I Need a Houseboat-poj
1005:I Think I Need a Houseboat 总时间限制: 1000ms 内存限制: 65536kB 描述 Fred Mapper is considering purchasi ...
- 【转】Swig 使用指南
原文链接:https://www.cnblogs.com/elementstorm/p/3142644.html 如何使用 API swig.init({ allowErrors: false, au ...
- 基于 HTML5 Canvas 的 3D 模型贴图问题
之前注意到的一个例子,但是一直没有沉下心来看这个例子到底有什么优点,总觉得就是一个 list 列表,也不知道右边的 3d 场景放两个节点是要干嘛,今天突然想起来就仔细地看了一下这个例子的代码,实际操作 ...
- JavaScript--我发现，原来你是这样的JS：函数表达式和闭包
一.介绍 本次博客主要介绍函数表达式的内容,主要是闭包. 二.函数表达式 定义函数的两种方式:一个是函数声明,另一个就是函数表达式. //1.函数声明写法 function fn2(){ consol ...