HTML标记语言和CSS样式的简单运用(Nineteenth Day)
曾经励志下去要坚持把每天所学的知识记录下来,可是坚持了几天后,就觉得自己坚持不下去了。。。。这几天自己好好的想了想,觉得不能坚持也得要坚持,因为要对自己负责,所以得学会逼着自己去做,只有这样才能把一件事做到底。。。。。。今天就总结一下所学到的知识。
理论:
HTML(Hyper Text Markup Language) 超文本标记语言
FrontPage
HTML元素


<a name="上面" href="#下面">跳到下面</a>
<table border=“1”>
<tr>
<td>单元格内容</td>
</tr>
<tr>
… …
</table>
跨列(合并列)的表格,使用colspan属性来实现
跨行(合并行)的表格,使用rowspan属性来实现
属性:
bgcolor 表格背景颜色
border 边框宽度,默认0
bordercolor 边框颜色
bordercolorlight 边框明亮部分的颜色
bordercolordark 边框昏暗部分的颜色
cellspacing 单元格之间的间隔大小
cellpadding 单元格边框与内容之间的间隔大小
width 宽度 像素或百分比
height 高度 像素或百分比
HTML表单
HTML表单是用于搜集用户输入的
HTML表单都扩在一对form标签中
<form>的常用属性
action 表示提交的目标服务器
method 提交的方法get、post
get(默认,以url提交,就是以地址栏的方式提交)
post(通过报文提交)
表单的基本元素
表单的基本标签
文本框标签<input type = “text“ />
密码框标签<input type = “password” value="" maxlength=""/>maxlength字符的长度
文本域标签<textarea>内容</textarea>属性rows(行)和cols(列)
复选框标签(有name才能提交)<input type=“checkbox” name=“ch1” value=“chone” checked=”checked“ />文字
<select>(name在这加才能提交)
<option>< /option>(Items)
</select>
分区标签:<div></div> or <span></span>(字符有多长,就占据多长)
框架组:不能有<body></body>
CSS样式(层叠样式表)
包括:行内样式,内嵌样式,类(class)样式,id样式,创建.css样式文件
行内样式级别最高,外部样式(样式表)高于内部样式。
基本样式:
font-size: 字体大小
font-style: 字体样式(斜体,歪斜体)
font-weight: 字体加粗
font-lighter: 字体变细
font-variant:small-caps 小型的大写字母
text-decoration:underline(下划线)or overline(上划线) or line-through(中划线)
text-indent: 字体缩进
text-height: 行高
text-transform:uppercase(大写字母) or lowercase(小写字母) or capitalize(首字母大写)
letter-spacing: 字间距
Word-spacing: 单词间的间距
border-width: 边框宽度
border-style: 边框样式
border-color: 边框颜色
background-color: 背景颜色
background-image: 背景图片
background-repeat:no-repeat 图片不循环
background-attachment:fixed 页面滚动,背景图片位置不动
background-position: 背景图片位置
实操:(简单举例出几个)
1. marquee标签的运用
效果:
2.图像标签的使用



<body>
<form> <h1>贵美网站会员登录</h1><br /><br /> <label>贵美网站邮箱:</label><input type="email" name="email" /><br /><br /> <label >输 入 密 码:</label> <input type ="password" name="pwd" maxlength="6" /><br /><br /> <label >再次输入密码:</label><input type ="password" name="apwd" maxlength="6" /><br /><br /> <input type ="radio" name ="release" checked />豪华版 <input type ="radio" name ="release" />简洁版<br /><br /> <!--checked表示当前被选中--> <input type ="checkbox" name ="login" />自动登录 <input type ="checkbox" name ="login" />安全登录<br /><br /> <input type ="reset" value ="重置" name="no" /> <input type ="submit" value="登录" name ="ok" /><br /><br /> <input type ="submit" style="background-color:orange;font-size:x-large;color:white" value ="现在就去注册" name="register" /> </form>
</body>
运行效果:
框架组的运用:
运行效果:
CSS样式的运用
样式表:
新建一个样式表,
好了,今天就先写到这里吧。希望自己明天还能继续。加油!
HTML标记语言和CSS样式的简单运用(Nineteenth Day)的更多相关文章
- HTML语言和CSS开发
第一张 HTML基础1.HTML:超文本标记语言(它除了文字,还能写图片.视频.音频.交互),他不是编程语言,它是标记语言2. <!DOCTYPE html> HTML5版本申明 < ...
- HTML语言和CSS开发商业站点 错题
1.关于css为什么会出现Bug说法不正确的是(). (选项两项) A.编写CSS样式是需要在不同浏览器中实现表现一致 B.各大主流浏览器由于不同厂家开发,浏览器使用的内核不同,支持CSS的程度不同 ...
- 使用HTML语言和CSS开发商业站点
第一章 预习笔记 单词: head:前进 title:标题 meta:超过 body:身体.尸体 W3C:全球最大的中文Web技术教程 strong:强烈的 target:目标,对象 href:水平参 ...
- c语言和c++栈的简单实现以及构造器的原理
也就是训练将原来的c语言 用类表示出来.. 关于构造器: //1与类名相同 没有返回值 被系统生成对象时自动调用,用于初始化 //2 可以有参数 构造器重载 默认参数 //3 重载和默认不能同时存在, ...
- Boostrap全局CSS样式
1.Bootstrap提供的CSS Reset * { box-sizing: border-box; } body { font ...; color: #333; background: ...; ...
- CSS样式表与HTML结合的方法
从此王子和公主幸福的生活在了一起:) 层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文 ...
- 为什么我获取不到这个css样式?js原生获取css样式总结
还是自己遇到的一个坑的总结吧!与其说是坑不如说自己学艺不精,让我先哭一会!! 需求 简单就是获取一个css的height (好吧 就是一个这么简单的需求) 实践 好吧 长时间的JQ 我已经对原生无能了 ...
- CSS样式表初学,比C#和JS简单
今天咱们一起来看下CSS样式表的基本基础 经常看博客或者喜欢钻研代码这一类的人对CSS可能有所耳闻,但具体的可能不是很清楚 那什么是CSS呢?与HTML又有什么区别呢?今天咱们就来说道下这个CSS C ...
- CSS样式设置语法全解,样式优先级、值和单位、字体、文本、块级元素,行内元素,替换元素、非替换元素、display、float、position、table、li、光标、边距边框、轮廓、颜色背景
全栈工程师开发手册 (作者:栾鹏) 一个demo学会css css选择器全解 css操作语法全解 CSS样式设置语法全解: 样式优先级 1. !important标记的样式 > 内联样式(sty ...
随机推荐
- windows8设置环境变量
win8,win8.1如何配置java的环境变量 工具/原料 win8,win8.1 方法/步骤 在你的计算机上右击,选择其中的属性就可以了.如下图所示. 接下来,作出如下图所示的选择. 这个 ...
- 让两个Div并排显示
一.使用display的inline属性 <div style="width:300px; height:auto; float:left; display:inline"& ...
- Http静态资源的缓存
最近一段时间一直在研究页面缓存和压缩方面的东西,由于公司服务器使用的是iis6.0,很多性能方面的优化都不支持.所以,就开始尝试着自己写个简单的处理程序. 为了减少服务器带宽的需求,我们要减少客户端与 ...
- golang 并发之协程及通道
一.概述 在golang中,每个并发执行单元称为goroutine,当程序启动时,main函数在一个单独的goroutine中运行,(main goroutine).新的goroutine会用go语句 ...
- CSS用法简介
CSS(Cascading Style Sheets层叠样式表)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言. 1.基本使用语法 ...
- 交互设计师谈颠覆式创新 | Think different
作者:Teambition 交互设计师 樊伟 本文由 Teambition 原创.转载请注明出处,附原文链接 题图:by Ed Chao 我们不需要像主流市场的大公司一样做类似相扑的庞大,而是需要像柔 ...
- JavaScript中的构造函数
目录: constructor & prototype 为构造函数添加属性和方法的多种不同方法 组合使用this和prototype关键字创建构造函数(常用方法) 用对象直接量作为构造函数的参 ...
- JDK,JRE,JVM区别与联系(转)
JDK : JavaDevelopment ToolKit(Java开发工具包).JDK是整个JAVA的核心,包括了Java运行环境(Java Runtime Envirnment),一堆Java工具 ...
- java.util.MissingResourceException解决策
.properties文件放到当前目录下会报错: 需要放到src文件夹下:
- android studio2.0 搭建Robotium环境--有被测源代码的情况下
1.导入robotium-solo-5.2.1.jar 包 导入junit:4.12.jar2.app- -src- -main- -libs 或者app-libs下 复制进去后,右键add a ...