Text colour in R markdown ioslides/js. reveal slides - r

I see from the R Markdown website that the colour of text can be changed like so:
<div class="red2">
This text is red
</div>
But this doesn't seem to work for text formatted with `, like "If in doubt, use ?dplyr::filter", for example.
Besides using css or html tags, is there a simpler way to do this?

Well, after poking around it seems that the quickest way to do this is with a html <style> tag. I was looking for something that avoided css or html, but this seems to be the best way to do this. There are plenty of options, but a simple one is:
If in doubt, use <bdi style="color:red;">`?dplyr::filter`</bdi> to get help.

Related

Customising Colour / Boldness in Markdown with RMarkdown / Bookdown

I am using bookdown to write some maths lecture notes. I find myself very often using the > blockquote feature. Often, this is because my environments, such as remarks and exercises take multiple lines. It is then ambiguous where the theorem ends and where 'chat' begins after.1 I'm pretty happy with doing this. I like the fact that the blockquote singles out the environments so it's very easy to see when one is changing to another. The thing I don't like is that it "softens" the text colour.
See the following screenshot, comparing the boldness of the font in the first paragraph with that in the blockquote.
Is there any way of removing this "softening"?
1
LaTeX gets around this by adding extra white-space around something like \begin{example} ... \end{example}. Alternatively, one can configure them to add a \qedsymbol to indicate that they have come to an end. I don't feel the first option would look nice in bookdown and I don't think the second option is even possible. It would actually be great for my long examples if it did!
Per your request, you can change the styles in HTML outputted R Markdown scripts by adding styles. There are a few different ways you can add them. Typically, I just place this content in between chunks.
<style>
blockquote {
font-color: black;
opacity: 1;}
</style>
You can attach an external style document or use a CSS chunk. I just find this easier for most projects.
You can read more about this here.

Add HTML code using CSS

html
<div id="mydiv"></div>
I want to add HTML code into this div (see following result I want) using ONLY CSS
<div id="mydiv">Lorem</div>
I think :after and :before are not helpful here!
CSS is not HTML. It is not possible to achieve that as CSS is not a markup language.
Just to add you can add content but not the element using :before or :after pseudo-element. Refer the specs
You shouldn't do this for many reasons.
Firstly its just wrong.
Secondly it is not possible.
Css is not for markup html is.
and I dont even understand why you would want to do this at all.
You can use content (just for text) in a couple of browsers but it's a really bad idea. Please solve this differently e.g. with Javascript, you'll need to for HTML anyway.

How to create CSS Line

How to make HTML file like below line image style? Please help. I want to use CSS.
Right click the page and view source, it's really just down to sifting through whats in the source, but it you're a beginner i would start out on simpler projects since this one looks like it uses heavy CSS, but if you know basic CSS then the answer is in the page's
I would recommend working on something a bit easier before trying something like this, get used to working with CSS selectors and things like :hover

Best way to replace a text using CSS [duplicate]

This question already has answers here:
How can I replace text with CSS?
(25 answers)
Closed 9 years ago.
I would like to replace a text say 'company name' in my project. The use-case is to produce documents (after pre-processing) for different companies only by maintaining a different stylesheet for different company.
SEO not much of the importance here.
I am using this approach:
html
<span class="company-name"> YourCompanyName </span>​
css
.company-name{font-size: 0}
.company-name:after{
content: "New Company Name";
font-size: 14px;
}​
and here is the jsFiddle http://jsfiddle.net/cN9gZ/
so here is my quick question: Is there any better way of doing the same thing, using css only?
If you really need to do such things in CSS, the following is a little more logical and a little less risky (with the Usual CSS Caveats in mind):
<style>
.company-name:after{
content: "New Company Name";
}​
</style>
<span class="company-name"></span>
That is, use an element with empty content, so you don’t need any trick to hide the dummy content.
CSS really isn't designed for this kind of thing. You'd be better off using Javascript, or even better, just altering the HTML code itself.
There really isn't any other way to do what you're asking in CSS other than the way you've done it: The content property isn't available in most CSS styles, because CSS isn't intended for placing content.
Is there any better way of doing the same thing, using css only?
No. Every other effect would basically result in the same method used: hide the original content and replace it with a pseudo-element (::after or ::before).
Note that search engines are likely to ignore the stylesheet, which could result in some strange search results. It's almost always a better idea to replace fixed content in the markup instead. In almost all cases it will take only a simple find-and-replace. JavaScript and CSS can be deactivated - markup can't.

JavaScript and CSS

I am wanting to implement Thickbox, which I have done a number of times.
My issue is that I am doing some jQuery like:
$('#txtData').load('aerialProductListing.inc');
and when this happens, the CSS is lost.
How can I get the stylesheet recognized again? or can i do something inline to work around?
Edit: txtData is simple:
<div id='txtData'><p></p></div>
aerialproductListing.inc is simple HTML and PHP, nothing fancy and to long to post, but the Thickbox piece isL
US Tip Chart
If a <style type="text/css"></style> element is declared inside the #txtData element, it will be gone after $('#txtData').load(...).

Resources