Day02

HTML和CSS

把网页比作一个房子,网页就是由一个个HTML标签组成,CSS样式负责修饰HTML标签。

HTML标签特点:语义化

<p></p>//段落
<body>//开始标签
</body>//结束标签
h1~h6//标题1到标题6
div//分隔
ul//不排序列表
li//列表项目
dl//定义列表
dt//定义术语
dd//定义描述
a//锚
br//换行
font//字体
img//图像
input//用于搜集用户信息
button//按钮
11png.png
图中的<div class="container">定义了div的类为container容器,在CSS修饰中可使用.container{}来改变div其中的样式

shift+alt+f:格式化代码

常用的CSS样式

CSS语法

<style>
*{margin:0px;padding:0px}//写网页的第一步重置边界和填充
</style>
9.png

CSS常用选择器

<p class=”one” id=”two”>hello world</p>

p{}元素选择器

p.one{}class选择器

.+className{}
特点1,可以给多个标签相同的class名
2,可以给一个标签多个class名

10png.png
margin-right:auto;margin-left:auto;//元素居中仅仅对块元素有效

常用的css样式

color:设置文字的颜色
width:设置一个元素的宽度
height:设置一个元素的高度
background-color:设置背景颜色
background-image:设置一个元素的背景图片
line-height:设置文字的行高
text-align:设置文字对其的方式
border-width:边框的宽度
border-style:边框的样式
boeder-color:边框的颜色
p:hover{color:blue}当鼠标移动到元素上时可以改变元素的css样式
cursor: pointer;可以使鼠标经过时变成手指
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 27,879评论 1 45
  • 学会使用CSS选择器熟记CSS样式和外观属性熟练掌握CSS各种选择器熟练掌握CSS各种选择器熟练掌握CSS三种显示...
    七彩小鹿阅读 6,358评论 2 66
  • 1 上章回顾与预习检查 1.1上节检查 id选择器 class选择器 jquery的引用 1.2预习检查 无 2....
    一刻时光阅读 409评论 0 1
  • 今天学到了什么 1.HTML常用的标签 ① p--段落标签 ②img 图片标签特殊:单标签src--标签的属性功...
    小小全_阅读 187评论 0 3
  • 有一个现象,当大家看到一对白发苍苍的夫妻手拉手出现在我们视野里面,大家会认为这是真爱,有多少年轻的夫妻经常这样手拉...
    成长在途中阅读 214评论 2 3