4 WP建站基础教程之CSS(0基础也能学)

本文是WP建站基础教程的第四节,内容为CSS

1. 视频教程第四节文字简介

1) DIV CSS JS的概念理解

DIV是盒子

CSS是控制盒子和内容的样式的语言

JS是控制动作等效果的语言

2)CSS的基础知识

CSS的基本语法 :

选择器{声明1;声明2;声明3;}

CLASS选择器

ID选择器

举例

3)CSS调试的方法和流程

Chrome – 右键 – 检查
左侧div, 右侧css
调试css
!important

CSS代码放哪里

2. 视频教程第四节视频


视频教程其他节次链接

本系列视频总共暂定12节,如果后面还有其他的内容,我会加进来。具体内容如下

1 WP建站基础教程之教程介绍
2 WP建站基础教程之网站基础
3 WP建站基础教程之网站结构
4 WP建站基础教程之CSS
5 WP建站基础教程之WP系统
6 WP建站基础教程之后台介绍及基础设置
7 WP建站基础教程之post和page使用
8 WP建站基础教程之菜单导航设置
9 WP建站基础教程之插件设置
10 WP建站基础教程之多媒体
11 WP建站基础教程之主题使用
12 WP建站基础教程之更新升级

 

Summary
4 WP建站基础教程之CSS(0基础也能学)
Article Name
4 WP建站基础教程之CSS(0基础也能学)
Description
本文是WP建站基础教程的第四节,内容为CSS。主要包括,DIV+CSS+JS的概念理解, CSS的语法学习,CSS在网站如何进行调试等。CSS是建站过程中用的非常多的一种语言,所以有必要好好学习一下。
Author
Publisher Name
Hunk外贸建站营销博客
Publisher Logo
4 条评论

4 条评论在 “4 WP建站基础教程之CSS(0基础也能学)”

  1. HUNK老师,你好。
    我在用AVADA主题,想实现一下选H2 TITLE时候,TITLE前面生成小色块。 在theme option里custom CSS添加了

    #main,.fusion-title h2.title-heading-left {
    border-left-style: solid;
    border-left-color: #00a196;
    border-left-width: 4px;
    box-sizing: border-box;
    padding-left: 6px;
    display:block !important;
    }

    基本也实现了,但是是全局实现的。而且首页上面有H2的地方都有这个block了,连首页的左侧边缘也有小色块。我只想在portfolio页面里面实现,应该怎么写CSS?

  2. 你好,按视屏找出产品gallery页面product title的字体是H3,但是到后台调整颜色,大小没变化。按你讲的CSS调试,大小可以调整,但字体颜色无变化,调整不了。请问什么原因?

    1. 可能的原因1. 代码写错,这种情况下,在调试状态是看不到你在后台添加的代码的 2. 优先级不够,这种情况下可以看到你在后台添加的CSS代码,但是被划掉了。

      一一排除吧,调试就是要不停的试。

发表评论

电子邮件地址不会被公开。 必填项已用*标注