网络安全攻防----html基础

 

  一.学习html的硬件条件

 

        网页(.Html)是静态的,学习html语言需要选择Chrome浏览器和Sublime3编辑器,选择Chrome浏览器是因为Chrome浏览器兼容性比较好,支持各种各样的插件和扩展。

Ctrl+s保存编写的代码

  二.标签

标签是允许嵌套的

(1)双标签

1.

(首标签)…

(尾标签)(下同)最大的标题

2. P标签 段落

3.Div标签 相当于一个容器

4.html标签表明文档的类型为html

5.Body标签是用户能看到的部分(用户部分)

 

 (2)属性标签

1.添加一本万国字典。不能实现中文,有乱码用单标签meta来解决

2.列表表示:

                           

  •                  

        例如:

      网络安全攻防----html基础_第1张图片

      会显示为:

      网络安全攻防----html基础_第2张图片

      3.添加样式

      Width:

      Heigt:

      Background:

      网络安全攻防----html基础_第3张图片

      4.Float浮动,改变布局,尽量避免重复代码

       

      把重复代码抽离出来,以便于维护。如何抽离?

      <1>Nav(一套样式的名字)

      网络安全攻防----html基础_第4张图片

      <2>

      通过名字查找样

      层叠样式表(CSS)

      如何引用公共样式

      Class

      (三)常用选择器:

      1. 类选择器:公用.+名字+{}    为相同的类名赋予样式
      2. ID选择器:#+名字+{}绑定的标签是唯一的:为对应的ID赋予样式,建议一个ID只能在一个标签出现一次
      3. 标签选择器:div+{选择所有的div元素}不需要进行标签引用   为相同的标签赋予样式
      4. 选择器优先级:

        ID>class(类选择器)>elemnet( 标签选择器) ice原则>

      核模型

      网络安全攻防----html基础_第5张图片

      (四)div的属性设置

      字体与左上方边缘的距离                       padding: 10px;

      div的边框大小和颜色                               border:  2px solid black;

      两个div之间的距离                                   margin: 10px;

      网络安全攻防----html基础_第6张图片

      Padding留白

      Border边框

      Margin 与其他标签的边距

      网络安全攻防----html基础_第7张图片

       

      注释用Ctrl+/

       

转载于:https://www.cnblogs.com/qiaodan/p/5712609.html

你可能感兴趣的:(网络安全攻防----html基础)