一、HTML:Hyper Text MarukupLanguage,超文本标记语言HTML，文件本质上是一个文本文件，文件扩展名通常是 .html 或 .htm。
网页的基本结构：
<html>
<head></head>
<body></body>
</html>
Html常用标签：
字体风格： <i> <s> <b> <u> <strong> <tt> <sub> <sup>
标题： hx
水平线：hr
换不换行标记：
br 强制换行
nobr 强制不换行
wbr 自动换行
段落标记：p
图片标记： img
音频标记： audio
视频标记： video
超链接标记： a
表单标记： form
输入标记 <input>
type="text"文本框，使用 placeholder属性指定在输入框中显示的提示信息
type="password"密码框，使用 placeholder 属性指定在输入框中显示的提示信息
type="radio" 单选按钮，使用 value 属性指定向服务器发送的值
type="checkbox" 复选框
type="submit"提交按钮
type="reset" 重置按钮
type="hidden" 隐藏表单域
type="file"文件选择器
type="image"图片提交按钮
type="button"普通按钮，默认不能执行任何操作
按钮 <button>
<buttontype="button" >显式/隐藏</button>
<buttontype="reset" >重置表单</button>
<buttontype="submit" >提交表单</button>
文本域 <textarea>
<textareaname="content">今天终于见到太阳了</textarea>
下拉框 <select>
二、使用CSS的方法
语法: 使用propertyName:propertyValue;的形式来设置CSS样式
用法1: (内联) 可以直接在 HTML 标记的开始标记中，使用 HTML 标记的 style 属性来设置 CSS 样式比如: <div style="color:red;font-size:25px;"></div>
用法2: (内嵌) 在<head> 区域使用<style> 标记来书写 CSS 内容
用法3: (链接) 在<head> 区域使用<link> 标记来链接外部 CSS 文件
CSS基本选择器
1、id selector( id 选择器 )
使用 # 做前缀
# 之后书写某个标记的 id 属性的取值
最后使用 { } 将所有的 CSS 样式括起来
2、class selector ( class 选择器 )
使用 .做前缀.之后书写某个标记的 class 属性值的某个取值
最后使用 { } 将所有的 CSS 样式括起来
3、attribute selector( 属性选择器 )
用 [ ] 将标记的属性括起来
[ ] 内部书写与标记的属性有关的表达式
[attribute] 选择所有包含 attribute属性的元素
[attribute=attrValue]选择所有包含 attribute 属性，并且取值是 attrValue 的那些元素
4、tag selector( 标记选择器 )
使用某个标记的名称作为选择器，比如 input { }
标记选择器对应的标记名称必须是 HTML 标准中定义标记
5、通配符 *
* { }
div>* { }
属性
外边距
margin
margin: 上 右 下 左 ;
margin: 上下 左右 ;
margin-top
margin-right
margin-bottom
margin-left
内边距
padding
padding : 上 右 下 左 ;
padding : 上下 左右 ;
padding-top
padding-right
padding-bottom
padding-left
轮廓
outline : 颜色 样式 宽度 ;
阴影
box-shadow: 水平偏移 竖直偏移 模糊距离 阴影距离 阴影颜色 [ inset ] ;
尺寸
height : 高度 ;
width : 宽度 ;
z-index : 深度(离眼睛的距离) ;
颜色
color : 前景色 ;
background-color: 背景颜色 ;
背景
背景颜色: background-color
背景图片
background :背景颜色 背景图片 背景位置 平铺方式 滚动方式 ;
字体
font-weight: 文字粗细 ;
font-size : 文字大小 ;
font-family: 文字字体 ;
font-style :normal | italic | oblique ;
文本
line-height: 行高 ;
text-decoration: none | overline | line-through | underline ;
排列
text-align :left | center | right ;
1047
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
