How to hide title and link html tag using css

Question

I have been trying to hide title and link tag using internal css, but it is not working.

<link rel="shortcut icon" href="./favicon.png"> <title>app · Streamlit</title>

I wanted to hide these two using css or js, Any solution?

Could you say why you want to hide the title? Are you wanting to put something else in its place? — A Haworth
– A Haworth, Commented Jul 15, 2022 at 17:35

Quentin · Accepted Answer · 2022-07-15 14:11:18Z

0

CSS cannot touch the browser chrome. It can't change the favicon or title in the address bar / browser tab / window title bar.

It can only affect the document in the viewport.

answered Jul 15, 2022 at 14:11

949k136 gold badges1.3k silver badges1.4k bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

any other solution using JavaScript?

@MuzammilDafedar Yes you could remove these elements using javascript. Removing the title will then result in the page's url being put into place.

Reza Saadati · Accepted Answer · 2022-07-15 22:30:23Z

There is nothing that you can do with CSS.

<title>app · Streamlit</title>

This is how you could set an empty text:

document.querySelector('title').innerHTML = '';

Or you could also remove that tag:

document.querySelector('title').remove();

<link rel="shortcut icon" href="./favicon.png">

Removing the value ./favicon.png will not help, so you will need to set an empty icon:

document.querySelector('link[rel~="shortcut"]').setAttribute('href', 'data:image/x-icon');