Okay so i just started a Tumblr blog the other day, and when i was editing the profile page i had happily found a edit with HTML button, and i thought wow now i can finally loose this (image below) that's intruding on my theme.
So, I hit CTRL + F to find code relating to the shape, and found that the shape was actually a fill rather than a preset image, so i entered the hex code for a transparent black #00000000), but to no avail, it didn't work, and after about an hour or so of scouring the web, I decided to reach out, and was possibly hoping that someone with HTML experience could help, anyways here's the code
Right the background you should be able to change within your template settings as this is just a background you need to change. This is not something within the HTML template - I am not sure how to change background in Tumblr but look within profile or theme settings, widgets or block.
Use inspect element and you will see this:
.header-image.cover {
background-image: url(http://static.tumblr.com/d3c51755c609fd193d623381320efcb6/kcvyami/oSJnx6juu/tumblr_static_tumblr_static_jqy1bj0w774s0o04wc4wsskc_focused_v3.gif);
}
The image that you are looking for is found here:
http://static.tumblr.com/d3c51755c609fd193d623381320efcb6/kcvyami/oSJnx6juu/tumblr_static_tumblr_static_jqy1bj0w774s0o04wc4wsskc_focused_v3.gif
If you're looking to delete the doge image, then delete this from the HTML:
<figure class="avatar-wrapper animate">
<a href="/" style="background-image: url(http://33.media.tumblr.com/avatar_e1fbc1eda419_128.png)" class="user-avatar">
<img src="http://33.media.tumblr.com/avatar_e1fbc1eda419_128.png" alt="" class="print-only invisible">
</a>
</figure>
Related
I am learning Blazor and at the moment I am trying to set an image as the background. I thought I would try display it first as the background-image css didnt work. I have attached a picture of my index.razor page and the img tag i am using is as follows:
<img src="file:///C:/Development/CsharpApplications/Portal/AlbertBartlettPortal/AlbertBartlettPortal/Pages/hero-range-1.jpg" alt="Background Image" />
It allows me to ctrl+click the file path and opens the image right away so it can see the image, but it wont display at all when the website is ran.
HELP!
Page Image Here
I put it in wwwroot\images and then used src="images/aaa.jg". No leading / OR ~/
I am trying to add a logo to my webpage. I am using CSS and eclipse. The image shows as a broken image and I am not sure why. The image I am trying to use is in the folder specified :
Does it need to be added in CSS or can someone please help me to know where I am wrong. Thank you.
<body>
<div class="jumbotron">
<h2 style="text-align: center; color: white;"> New Plan </h2>
<a href="#">
<img src="resources/img/logo.png">
</a>
</div>
</body>
This wouldn't be a css issue if the browser is showing the broken link icon. That icon means the path to the file is incorrect or it can't retrieve it.
To confirm this, take resources/img/logo.png and add it to the end of the URL where your HTML is, excluding any files. For instance, if your URL is http://example.com/index.php, you want to make the URL read as http://example.com/resources/img/logo.png, without the index.php.
You will need to tweak this URL until the image shows up in the browser, since you didn't provide a URL where the HTML is running. When that happens, the URL in the address bar is the one you can use for the image URL.
I'm sure this is super easy but I'm a beginner. I have my code to pull up my logo but my logo just pulls up a broken image icon. See screencast
See screencast: http://screencast.com/t/ar8cpTIbMs
Here is my HTML:
<div id="logo">
<img src="C:\Users\Brent\Documents\Website Development"/>
</div>
I really only need my HTML figured out and I assume the CSS will work pretty well after that. Thanks for the help!
You must enter the correct file name for src. Such as
<img src="C:\path\to\your\file.jpg" />
http://www.w3schools.com/tags/tag_img.asp
Please note that it is not a good practice to use absolute paths in your src attribute.
In the other hand, you can use base64 encoded image data as src of your img tag. Something like
<img src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD...//Z" />
https://www.base64-image.de/tutorial
If you use this method, you dont need to keep your logo.jpg file anywhere.
Hope this will help.
You are linking to a directory in your img tag, instead of an image file. Also, I would suggest either practicing online in a free webhost or downloading a stack package like WAMP/MAMP/LAMP. You'll start running into problems where you can use http protocols pretty quickly in your studies. Though, that can get technical, so I say stick to a free webhost for now. You will get weird hang ups trying to use the file system that will ultimately confuse you while you are trying to learn.
The problem lies in your src for your <img>. You're linking it to a directory /Users/Brent/Documents/Website Development right now, when you should be linking it to the image. If your image is called logo.png, then you should link it with C:\Users\Brent\Documents\Website Development\logo.png. Also, instead of linking it to C:\Users\Brent\Documents\Website Development\logo.png, link it to the image based on where the file is. For example, if your file is in \Website Development\index.html, then all you need to put for the src is "logo.png".
You should move your logo to the same path as your website. Ex:
Website: C:/site/index.html
Logo: C:/site/logo.jpg
Then include the logo as:
<div id="logo">
<img src="logo.jpg">
</div>
Hint: You don't have to have the div for the logo to show up.
please enter the complete path including your image.
for example if your file name is mypic.jpg .Then
<img src="C:\Users\Brent\Documents\Website Development\mypic.jpg" />
I need some help here.
I found the "Miniport" template by "html5up" and I want to use this template as a base for my future projetc.
The demo can be seen here: http://html5up.net/miniport
On the demo we can see that bellow the website menu is an circular image and next to it is some texts. I need to know how to remove that image and center the texts so the texts can match the rest of the template (the site has the divs centered too).
I dont have much skills on css nor html5. Im a fan and I want to learn.
If anybode can help me, please..
Sorry about my english.
I too am using this template.
In order to remove the image, open the html document.
Delete this code that is found between ~line 42—46: (this is what formats and holds your image)
<article class="container" id="top">
<div class="row">
<div class="4u">
<span class="image fit"><img src="images/angela.jpg" alt="" width="118%" height="350" /></span>
</div>
Reformat the div tag:
<div class="8u"> to <div class="container" align="center">
By doing this, you are modifying the style within the html document rather than the css doc. This is good since you do not want to change every div tag in the html doc, just this one. Additionally, adding align="center" helps override most css formatting within your divs. You can use that trick later on in your site.
On a side note, double check that you like the command the contact form uses. I do not, since it opens up my computer's email app rather than directly sending the email through the webpage. That's my next project.
Enjoy!
I have a website set up at http://jamesfrewin.co and I have tried to make the small envelope icon have the link for mailto work just on the envelope image but it seems to be overflowing to the whole box.
Any help to sort this out would be greatly appreciated.
http://jsfiddle.net/JzEnm/
Code
The code for my page is on the link above.
Thanks!
This is happening because your anchor tag includes the envelope image, profile image and the text. Close the tag after the envelope image. Change this and you should be good to go.
<a href="mailto:jfrewin#me.com"><img class="image image-5" src="images/Envelope1.png" onmouseover="this.src='images/Envelope2.png'" onmouseout="this.src='images/Envelope1.png'">
<img class="image image-6" src="images/Profile Card.svg">
</a>
The answer you're looking for has been provided by #James. Just missing an ending anchor tag.
From someone who appreciates good, clean code and following best practices, I challenge you to strip your hover events and replace them with sprites and css :hover effects.
Add </a> after <img alt="" class="image image-5" src="images/Envelope1.png" onmouseover="this.src='images/Envelope2.png'" onmouseout="this.src='images/Envelope1.png'">