零基础学习HTML&CSS -01

最新推荐文章于 2024-07-10 16:57:46 发布

Hui.6

最新推荐文章于 2024-07-10 16:57:46 发布

阅读量29

点赞数 1

文章标签： html5 css

本文链接：https://blog.csdn.net/weixin_64502483/article/details/131064006

版权

初始html

HTML （Hyper Text Markup Language）超文本标记语言

<!DOCTYPE html>

这是根标签一个网页只有一个根标签网页所以部分写在html标签

注释用于解释说明便于代码阅读和维护

块级元素和行内元素

块级元素有 div,p,section,header,footer,nav,adress...

特点：

独占一行
宽度默认100%
可以通过css属性设置宽高
高度又内部内容决定

行内元素span a strong b i em mark sub sup u cite ...

特点：

与其他行内元素共享一行
高度由内部决定
无法通过css属性设置变高
不建议行内元素嵌套块级元素

常用标签

标题标签

a标签

打开链接进行页面跳转
锚点指定锚点跳转

回到顶部 href='#'
指定锚点
给标签设置id href='#id'

3. 发送邮件

href='mailto:邮箱地址'
target 指定a标签打开方式
base标签可以指定所有a标签得打开方式 a标签与base冲突就近原则

<!--超链接标签 进行页面跳转 本地 外部网址 锚点 指定跳转方式(blank打开新页面 self在当前页面打开)可使用base标签(在head里面)指定a标签跳转方式-->
    <!--打开本地页面-->
    <a href="./2-块级元素和行内元素.html" target="_blank">2页面</a><br>
    <a href="https://www.baidu.com" target="_self">百度一下</a>
    <!--打开电子邮件-->
    <a href="mailto:******@qq.com">打开邮箱</a>
    <!--设置锚点-->
    <br><br><br><br><br><br><br><br><br><br>
    <br><br><br><br><br><br><br><br><br><br>
    <a href="#" target="_self">回到顶部</a><br>
    <a href="#box">回到h1标题</a>

图片标签

img

属性 width height src alt

音视频标签

video

autoplay 自动播放
muted静音播放
controls 控制条
loop 循环播放
poster封面
width height
source
src
type

audio

autoplay 自动播放
muted静音播放
controls 控制条
loop 循环播放

h5新增语义化标签
header footer article nav address details配合summary
figure figcaption

 <figure>
        <figcaption>我是一个图片</figcaption>
        <img src="../音视频/ad7.jpeg" alt="">
    </figure>
    <details>
        <summary>一线城市</summary>
        <div>北京</div>
        <div>上海</div>
        <div>深圳</div>
    </details>
    <mark>高亮效果</mark>
    <u>下划线</u>

Hui.6

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
零基础学习HTML&CSS -01

块级元素有 div,p,section,header,footer,nav,adress...base标签可以指定所有a标签得打开方式 a标签与base冲突就近原则。这是根标签一个网页只有一个根标签网页所以部分写在html标签。标签四个属性 id ，class， style， title。给标签设置id href='#id'style 给标签设置样式内联样式行内样式。注释用于解释说明便于代码阅读和维护。<h1>一级标题</h1><h2>二级标题</h2><h3>三级标题</h3>
复制链接

扫一扫