一、html简介

**1.释义：超文本标记语言（Hype Text Markup Language，网页就是由一个个html标签组成的

2.html写法 **

<html>            //开始标签
  <head></head>   //头部
  <body></body>   //网页的内容都是在body里面写的
</html>

3.html特点：语义化

4.html常用标签

<body>
  <h1></h1>            //标题标签 有h1~h6,由大到小
  <p></p>              //段落标签
  <div></div>          //区域块标签
  <a href=""></a>      //超链接标签 href属性内容为链接地址
  <img scr="">         //图片标签，src存放地址，是特殊的没有结束标签
  <input type="">      //输入框标签，type输入类型，也是特殊的没有结束标签
  <button></button>    //按钮标签
  <ul>                 //以无序的方式来显示一个列表标签
    <li></li>          //有序无序的唯一子元素，可以包含任意标签
  </ul>  
  <ol>                 //以有序的方式来显示一个列表标签
    <li></li>          
  </ol>
  <dl>                 //自定义列表标签
    <dt></dt>          //列表头部
    <dd><dd>           //列表数据
  </dl>
</body>

二、CSS样式简介

1.**css解释:层叠样式语言，用来定义页面元素的外观，对html标签进行修饰**

2.常用css样式

selector {property: value}
eg:
//HTML
<h1>hello world</h1>
//css,通常css的样式是写在html头部的style标签下，这里用的是元素选择器
h1 {color:red; font-size:14px;}

<p class="one" id="two">hello world</p>
    p{} //元素选择器
   .one{} //class选择器,最好选择元素选择器
    #two{} //id选择器

3.盒子模型

padding:0;//填充
border:0; //边框
margin:0; //外边距
//只对块元素起作用
margin-left:auto;
margin-right:auto;

4.样式重置

//在进行样式的改变时最好要进行样式重置才更好的设置
*{margin:0; padding:0}

5.常用的css样式属性

color:设置文字的颜色
width:设置一个元素的宽度
height:设置一个元素的高度
background-color:设置背景颜色
background-image:设置一个元素的背景图片
line-height:设置文字的行高
text-align:设置文字对其的方式
border-width:边框的宽度
border-style:边框的样式
border-color:边框的颜色
p:hover{color:blue}当鼠标移动到元素上时可以改变元素的css样式

padding{
   padding-top/left/right
}
margin-top/left/right
position
border
border-botton
border-radius
border-collapse
border-color
border-style
text-align
text-decoration
background
background-color
background-image
background-repeat
font
font-style
font-weight
font-size
font-color
font-family

JavaWeb 入门笔记

HTML-CSS

一、html简介

二、CSS样式简介