CSS for selecting all images in a page

  • Resolved fahara

    (@fahara)


    7 years, 5 months ago

    [ Moderator note: moved to Fixing WordPress. Please do not use Developing with WordPress for these topics. ]

    Hello,

    I would like to reduce opacity of the picture which is on my frontpage.
    https://www.clementchambaud.com

    I find this `img {
    opacity: 0.5;
    filter: alpha(opacity=50); /* For IE8 and earlier */
    }`
    but of course it select all images of the entire website.
    I have the solution to select the picture in my frontpage specifically but in case I need to change of picture, I think it is more simple to apply the style to all images in the page.

    How could I do that ?

    Thanks for your help

Viewing 4 replies - 1 through 4 (of 4 total)

  • Hello you can direct the CSS to your home page only like this.

    body.home .entry-content img {
    opacity: 0.5;
    filter: alpha(opacity=50); /* For IE8 and earlier */
}

    To explain further, every page comes with a set of classes generated by WordPress, example: page-id-2, page-template-default etc etc. Usually as in your case the ‘homepage’ has the class ‘home’ in the body tag. This way it’s easy to target specific CSS cases on pages and so on.

    This will only affect the img within the homepage + entry content div.

    Hope this helps!

    Best regards,
    Konstantinos

    Thread Starter fahara

    (@fahara)

    Hello, thanks for your answer. It works perfectly.

    Just for learning purpose, where do I find the page id in the code ?

    Thanks again

    If you mean in your source code, you can do a right click View page source ( if you are using chrome ) or Inspect and search for <body , you will find all the classes listed there.

    If you mean from your Admin Panel you can find the page-id by looking at the address bar when editing a post you will see a ‘post.php?post=2’ this means page-id-2 and so on.

    Don’t forget to mark this thread as resolved!

    If you need more help feel free to ask.

    Best regards,
    Konstantinos

    Thread Starter fahara

    (@fahara)

    Hello,

    Thanks again for your help.

    As I am just discovering www.ads-software.com, Web dev and CSS I will sure need more help soon ??
    I already asked a question in another section (for metaslider plugin), in case your are able to answer:
    https://www.ads-software.com/support/topic/vertically-align-picture-in-the-slider/

    Thanks

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘CSS for selecting all images in a page’ is closed to new replies.