Ticker

6/recent/ticker-posts

How to Add Logo Top Left Corner in Oracle APEX - Javainhand Tutorial

In this Oracle APEX Tutorial, We will explore about the add logo top left corner in Oracle APEX.

How to Add Logo Top Left Corner in Oracle APEX

In most of the websites, Logo is very important because it defines your identity to website visitors. So it is important to add your logo to a good place.

I will share simple steps to add the logo to the top left side corner in the Oracle APEX login page.

Step 1:-Go to your page HTML Header section and add the image HTML tag. I have added the following code in the page HTML Header section because the use of CSS we can add more styling on logo.you can simply add only HTML image tag.you can match the following screen.

<div class="header">
<img src="https://yt3.ggpht.com/a/AGF-l7_Ei7X9geMarqHxxX7_g5Jzoft1u0364dYkaQ=s900-c-k-c0xffffffff-no-rj-mo" 
alt="logo" />
</div>
How to Add Logo Top Left Corner in Oracle APEX
Screenshot 1

Step 2:-Now I have to add CSS code in page CSS inline section. Add the following code. you can match also the following screen.

.header img {
    float: left;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    box-sizing: border-box;
    padding: 5px;
}
.header img:hover {
  box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
}
How to Add Logo Top Left Corner in Oracle APEX
Screenshot 2

That's all for today I think this Add Logo Top Left Corner in Oracle APEX post will helpful for you. 

If you like this post then share your view in the comment box. Also, Share this post with your friends and also share in the oracle apex related group.


Preview Image:-

Add Logo Top Left Corner in Oracle APEX

Post a Comment

3 Comments

  1. Hi and if I have a logo file how to change the src attribute in step 1?

    ReplyDelete
    Replies
    1. You have to upload your logo file in static application files and copy the reference URL and change it.

      Delete

If you have any doubts, Please let me know